如何解决CSS 允许页脚位置覆盖@page .margin-bottom
我正在生成 PDF 并且内容是动态的。内容可能跨越 2 个页面,当它发生时,页脚与内容重叠。
我决定尝试使用以下内容
@page
{
margin-bottom: 150px;
}
这会将包括页脚在内的所有页面内容向上推 150 像素。我想知道是否有办法让页脚容器不受此底部边距的影响。
我基本上希望页脚填充页面底部的 150 像素间隙。如果我不使用这个边距,页脚只会与页面内容重叠,然后流到下一页,这就是问题所在。
灰色条是页脚,正如您所看到的,文本与它重叠。此屏幕截图还应用了页边距底部,因此我想向下移动页脚以填补该空白。
解决方法
听起来很有挑战性!您需要的是 "sticky footer"。使用弹性盒。此代码告诉父元素为页面的 100vh,子元素填充剩余空间。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。