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 的元素在打印时,必须是可显示的,否则不起作用。

网页中如何用 CSS 设置打印分页符的更多相关文章

  1. Bootstrap css栅格 + 网页中插入代码+css表格

    设计达人 http://www.shejidaren.com/30-minimal-app-icons.html CSS栅格: <!DOCTYPE html> <html lang= ...

  2. 如何用css写打印样式

    打印样式 打印样式就是针对网页被打印时设置给文档的样式,由于打印时是显示在纸上,跟屏幕还是有区别的,对于有打印需求的网页往往需要设置专门的打印样式来适配页面. @media print 声明自己是打印 ...

  3. 网页中三角型的CSS实现

    我们在使用CSS框架的时候,经常会用到下拉框组件,一般该组件里面有个下三角.很多网上用到三角形,如图所示,这个三角形是如何实现的呢? 1.使用CSS可以实现,先来复习一CSS盒子模型相关知识.给出如下 ...

  4. 一、HTML和CSS基础--网页布局--如何用css进行网页布局

    什么叫做布局? 又称版式布局,是网页UI设计师将有限的视觉元素进行有机的排列组合. 网页设计的特点 网页可以自适应宽度 网页的高度理论上可以无限延长 网页分栏 分栏又称为分列,常见的布局分为:一列布局 ...

  5. 如何用css设置鼠标属性的小手

    在元素中添加onmouseover="this.style.cursor='hand'"或者 cursor:pointer;

  6. C# 网络编程之webBrowser获取网页url和下载网页中图片

    该文章主要是通过C#网络编程的webBrowser获取网页中的url并简单的尝试瞎子啊网页中的图片,主要是为以后网络开发的基础学习.其中主要的通过应用程序结合网页知识.正则表达式实现浏览.获取url. ...

  7. LODOP设置打印份数及是否逐份输出

    LODOP中通过SET_PRINT_COPIES可以设置打印份数,例如:LODOP.SET_PRINT_COPIES(2);//指定份数为2份 如果一个任务里有多页,打印份数的时候,有两种输出方式,一 ...

  8. word 的使用 —— 分页符与分节符

    节的概念:节定义了一些格式, 如页边距.页面的方向.页眉和页脚,以及页码的顺序. 分节符是指为表示节的结尾插入的标记. 分节符的作用: 分节符起着分隔其前后文本格式的作用,如果删除了某个分节符,它前面 ...

  9. php部分:网页中报表的打印,并用CSS样式控制打印的部分;

    网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...

随机推荐

  1. oracle 同义词

    同义词概念 Oracle的同义词(synonyms)从字面上理解就是别名的意思,和视图的功能类似,就是一种映射关系.它可以节省大量的数据库空间,对不同用户的操作同一张表没有多少差别;它扩展了数据库的使 ...

  2. PHP修改记录

    1. Http请求错误--20151123 参考网址:http://www.lvtao.net/dev/php-nginx-uploadfiy.html 是配置问题,修改php.ini文件: uplo ...

  3. QTP使用小技巧

    1.创建action template.     当希望在每一个新建action时都增加一些头部说明,比如作者.创建日期.说明等,用action template     来实现最简单快捷.      ...

  4. Win7 Cygwin环境试验Nutch tutorial遇到的异常解决方法

    安装tutorial的步骤安装Nutch,当执行下面这条命令时出现异常 bin/nutch crawl urls - -topN Injector: starting at -- :: Injecto ...

  5. git fetch pull checkout区别

    Git中从远程的分支获取最新的版本到本地有这样2个命令: 1. git fetch:相当于是从远程获取最新版本到本地,不会自动merge <p style="margin-top: 0 ...

  6. struct函数

    //今天老师叫用一个struct函数做一个函数指针循环 突然我都不知道struct函数怎么用了 害的我下去查了很多资料 第一个定义法: int fun1(){    struct student{   ...

  7. 哈佛大学构建动态网站--第七讲ajax

    Ajax ajax举例: DOM的结构 通过js来修改html页面. Ajax的含义: return false的用途 跨浏览器的ajax 为什么不直接从yahoo获得数据呢? XMLHttpRequ ...

  8. unable to connect to :5555

    有可能批处理文件用的adb和eclipse的adb不兼容.把你的批处理文件用的adb换成eclipse的adb就可以了: 运行结果:

  9. Laravel中使用Redis

    安装PHP PRedis PRedis是laravel访问redis的扩展包,只需要下载原码即可,不需要安装PHP扩展(如php-redis.so).但在这之前需要了解一个composer,因为lar ...

  10. 多个dropdownlist只有第一个能选中,其他选不中之我见

    前段时间遇到这个问题,发现在页面中的源代码已经显示selected=“selected" 可是还是选中的第一项,试过很多办法,都不行,最后只好靠js来解决了,获取所有的dropdownlis ...