博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
网页中如何用 CSS 设置打印分页符
阅读量:5262 次
发布时间:2019-06-14

本文共 737 字,大约阅读时间需要 2 分钟。

Word 中按 Ctrl + Enter 创建一个分页符,方便打印,其实网页中也可以,用 CSS 的 page-break-after:always;。

<p>第 1 页</p>
<div style="page-break-after:always;"></div>
<p>第 2 页</p>
<div style="page-break-after:always;"></div>
<p>第 3 页</p>

任何浏览器都支持 page-break-after:always;,但 page-break-after 的其他属性值 left、right、inherit、avoid 则总有一些浏览器不支持。page-break-after 应用于 position 值为 relative 或 static 的非浮动块级元素。元素或父元素的 display 为 none 时,page-break-after 不起作用。

上面把 page-break-after 应用在一个空白的 div,使看起来更像一个分页符,其实 page-break-after 应用在当前页的最后一个标签,比如下面的代码:

<p>第 1 页</p>
<p style="page-break-after:always;">第 1 页</p>
<p>第 2 页</p>
<p style="page-break-after:always;">第 2 页</p>
<p>第 3 页</p>
<p>第 3 页</p>

page-break-after 的元素在打印时,必须是可显示的,否则不起作用。

转载于:https://www.cnblogs.com/lxboy2009/p/3913118.html

你可能感兴趣的文章
针对sl的ICSharpCode.SharpZipLib,只保留zip,gzip的流压缩、解压缩功能
查看>>
【转】代码中特殊的注释技术——TODO、FIXME和XXX的用处
查看>>
【SVM】libsvm-python
查看>>
Jmeter接口压力测试,Java.net.BindException: Address already in use: connect
查看>>
Leetcode Balanced Binary Tree
查看>>
Leetcode 92. Reverse Linked List II
查看>>
九.python面向对象(双下方法内置方法)
查看>>
go:channel(未完)
查看>>
[JS]递归对象或数组
查看>>
LeetCode(17) - Letter Combinations of a Phone Number
查看>>
Linux查找命令对比(find、locate、whereis、which、type、grep)
查看>>
路由器外接硬盘做nas可行吗?
查看>>
python:从迭代器,到生成器,再到协程的示例代码
查看>>
Java多线程系列——原子类的实现(CAS算法)
查看>>
在Ubuntu下配置Apache多域名服务器
查看>>
多线程《三》进程与线程的区别
查看>>
linux sed命令
查看>>
html标签的嵌套规则
查看>>
[Source] Machine Learning Gathering/Surveys
查看>>
HTML <select> 标签
查看>>