当我打印以下代码时,绿色页脚与黄色容器重叠。当打印时遇到页脚时,我需要打破黄色并转到下一页。
HTML如下
<body>
<div class="container">
This is the container
</div>
<div class="footer">
This is the footer
</div>
</body>
CSS如下
body{
height: 100vh;
margin: 0;
-webkit-print-color-adjust:exact;
}
.container{
background-color:yellow;
width: 100%;
height: 1500px;
}
.footer{
position: fixed;
bottom: 0;
width: 80%;
height: 100px;
background-color: #21f50056
}
最佳答案
最终使用javascript,在添加任何元素之前,我先检查了容器的高度。如果高度超过页面高度,请插入分页符。
关于html - 打印时Div重叠,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51993545/