css控制页面打印(分页、屏蔽不需要打印的对象)
样式:
<style media="print">
.Noprint { DISPLAY: none;}
.PageNext { PAGE-BREAK-AFTER: always }
</style>
注:
①、不需要打印的对象要用上“Noprint”样式。
②、需要换页处理的对象要用上“PageNext”样式。
③、因为最后一页不用加入换页符,所以要控制最后一页不要使用该样式。个人感觉用PAGE-BREAK-BEFORE属性控制第一页要方便一些。
=====================================================================================
page-break-before和page-break-after(来自网络)
page-break-before和page-break-after CSS属性并不会修改网页在屏幕上的显示,这两个属性是用来控制文件的打印方式。每个打印属性都可以设定4种设定值:auto、always、left和right。
Auto:是默认值,只有在有需要时,才需设定分页符号 (Page breaks)。
page-break-before若设定成always:则是在遇到特定的组件时,打印机会重新开始一个新的打印页。
page-break-before若设定成left:则会插入分页符号,直到指定的组件出现在一个左边的空白页上。
page-break-before若设定成right:则会插入分页符号,直到指定的组件出现在一个右边的空白页上。
page-break-after属性会将分页符号加在指定组件后,而非之前。
设置为left或right 与 设置为alvays究竟有什么区别,上面红色字体的说明看不明白,希望看到贴字的明白人指点一二。
不过用“always”值再加以控制一般的问题都能解决,以下为例子:
- <html>
- <head>
- <title>Listing 14-4</title>
- </head>
- <body>
- <div>
- This is the first DIV.</div>
- <div style="page-break-before: always">
- This is the second DIV.</div>
- <div style="page-break-before: always">
- This is the third DIV.</div>
- <div style="page-break-before: always">
- This is the fourth DIV.</div>
- </body>
- </html>
或
- <html>
- <head>
- <title>Listing 14-4</title>
- </head>
- <body>
- <div style="page-break-after: always">
- This is the first DIV.</div>
- <div style="page-break-after: always">
- This is the second DIV.</div>
- <div style="page-break-after: always">
- This is the third DIV.</div>
- <div>
- This is the fourth DIV.</div>
- </body>
- </html>
程序员的基础教程:菜鸟程序员
css控制页面打印(分页、屏蔽不需要打印的对象)的更多相关文章
- Flex中使用CSS控制页面样式
Using file: Stylebounding.mxml Stylebounding2.mxml myCSS0329.css 在Flex4中使用CSS控制样式,既可以直接在MXML文件中写样式,也 ...
- 【学习DIV+CSS】2. 学习CSS(一)--CSS控制页面样式
1. CSS如何控制页面 使用XHTML+CSS布局页面,其中有一个很重要的特点就是“结构与表现相分离”(结构指XHTML,表现指CSS).有人这样描述这种分离的关系,结构XHTML好比一个人,表现C ...
- 《Two Days DIV + CSS》读书笔记——CSS控制页面方式
1.1 你必须知道的知识 (其中包括1.1.1 DIV + CSS的叫法解释:1.1.2 DIV + CSS 名字的误区:以及1.1.3 W3C简介.由于只是背景知识,跳过该章.) 1.2 你必须掌握 ...
- 通过CSS控制页面中的内容垂直居中的方法
方法一:通过行高(line-height)定位 line-height通常是用于调节一段文字的行与行之间的距离,或者说两行文字之间的距离,如果行高是500px,那么每一行中的文字距离本行的顶部就是25 ...
- css控制页面文字不能被选中user-select:none;
现象:html中可能有些地方不想让用户复制文字,或是用a标签做了个点击按钮,点快的时候文字会被选中,很丑,这个时候可以使用下面的方案禁止文字选中. 原因:鼠标点快了文字会被选中. 解决方案:不同的浏览 ...
- 译-使用Scroll Snapping实现CSS控制页面滚动
特别声明,本文翻译自@alligatorio的Control Page Scroll in CSS Using Scroll Snapping一文,受限于译者能力,译文或存在不足,欢迎大家指出.如需转 ...
- Web--CSS控制页面(link与import方式区别)
先了解: [1] “Table”和“DIV”这两个网页元素诞生的目的不同,首先Table诞生的目的是为了存储数据,而DIV诞生的目的就是为了架设页面结构 W3C,是World Wide ...
- Web--CSS控制页面(link与import方式差别)
先了解: [1] "Table"和"DIV"这两个网页元素诞生的目的不同,首先Table诞生的目的是为了存储数据,而DIV诞生的目的就是 ...
- 应用CSS的page-break-after属性 实现WEB页面强制分页打印
虽然dedecms.com向大家介绍了很多CSS属性的相关知识,但有些非常冷门的属性还是有所欠缺.在B/S程序中,对打印页面的控制,CSS相对比较弱,例如: 自动分页, 就基本没啥实际用途.我们通常需 ...
随机推荐
- SQL 查询某个表被哪些存储过程使用到
--1.查询某个表被哪些存储过程使用到 : select distinct object_name(id) from syscomments where id in (select object_id ...
- Java事务处理全解析(六)—— 使用动态代理(Dynamic Proxy)完成事务
在本系列的上一篇文章中,我们讲到了使用Template模式进行事务管理,这固然是一种很好的方法,但是不那么完美的地方在于我们依然需要在service层中编写和事务处理相关的代码,即我们需要在servi ...
- 递归绑定将数据表中的数据按层级更新到 TreeView节点上
private void bindTreeView1() { string sql = "select * from dm_category&quo ...
- HTC Vive开发笔记之SteamVR插件集成
重要组件 SteamVR_Camera VR摄像机,主要功能是将Unity摄像机的画面进行变化,形成Vive中的成像画面 使用方法: l 在任一个摄像机上增加脚本 l 点击Expand按钮 完成以上操 ...
- HTC Vive开发笔记之手柄控制
怎么安装设备,配置环境我就不说了,自行百度,教程很多也很简单.接下来说下Vive手柄的控制. 手柄是HTC Vive的重要交互手段,我们通过第一个图片应该对其有一个直观的了解了,总共是九个按钮: 第一 ...
- gerrit集成gitweb后,点击gitweb连接:not found(转载)
From:http://blog.sina.com.cn/s/blog_4fb490ff01018i0v.html 需要添加refs/meta/config的read access权限.
- 114、Android禁止ViewPager的左右滑动
有时候在开发中会遇到一些“诡异”的要求,比如在ViewPager中嵌入ListView,或者再嵌入一个ViewPager,那么在滑动的时候就会造成被嵌入的XXView不能滑动了,那么现在就把最外层的V ...
- pytion学习1
个人感觉学习一门新语言,简单的语法懂一点足矣.接下来就是编程.读懂别人程序的每一句,理解每一句的意义. #Filename:MyAddressBook.py import cPickle as p i ...
- google快捷键,通过浏览器本身来查看
今天玩google浏览器时发现一个不需要访问google就能查看其快捷键的方式,再此记录一下,以备后用. 1:打开Google浏览器 2:打开开发者工具,有三种方法 2-1:按F12快捷键 2-2:按 ...
- MFC使用TRACKMOUSEEVENT触发mouseHover和mouseLeave
为对话框添加WM_MOUSEHOVER或WM_MOUSELEAVE消息并不会响应.MFC需要特殊处理,其中一法就是使用TRACKMOUSEEVENT void CmfcDlgDlg::OnMouseM ...