用CSS建立复印网页页面的实际流程

日期:2021-03-08 类型:科技新闻 

关键词:制作小程序,小程序商城,扫码点餐小程序,微信小程序开店的步骤,牛刀小程序

用CSS建立复印网页页面,无须为复印而专业创建1个HTML文档,能够节约1些精力,其前提条件是按“WEB规范”用CSS+DIV合理布局HTML网页页面。
第1、在HTML网页页面添加为复印机设定的CSS文档

拷贝编码
编码以下:

<link href="css/admin.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/admin-print.css" rel="stylesheet" type="text/css" media="print" />

media="screen" ,是朝向显示屏的;

media="print" ,是朝向复印的;
第2、创建复印版本号的网页页面,除去无须要的网页页面元素,如导航栏、侧栏、广告宣传、版权等。这时候便可以反映出按“WEB规范”做网页页面的优点了,用CSS换个版式很非常容易。

拷贝编码
编码以下:

/* 掩藏不复印项 start */
h1 span { /* 副题目 */
display: none;
}
#sidebar { /* 侧栏 */
display: none;
}
#content td.ads { /* 报表内广告宣传 */
display: none;
}
#content th.col2 span { /* 锚连接 */
display: none;
}
#content #bottom⑵ { /* 页尾报表复印 */
display: none;
}
/* 掩藏不复印项 end */

第3、复印按钮涵数,IE、Firefox都可一切正常复印。

拷贝编码
编码以下:

<input type=button value="打 印 本 页" onclick="window.print()">

此外,也有1个当地版的复印网页页面,能够开展“复印设定”和“复印预览”,但由于此设定,互联网复印必须启用IE访问器1个控制,还需减少ActiveX控制安全性,且只能在IE上运作,不好用。因此只贴1下启用编码,备份数据。

拷贝编码
编码以下:

<OBJECT id=WebBrowser classid=CLSID:8856F961⑶40A⑴1D0-A96B-00C04FD705A2 height=0 width=0> </OBJECT>
<input type=button value="复印预览" onclick=document.all.WebBrowser.ExecWB(7,1)>
<input type=button value="网页页面设定" onclick=document.all.WebBrowser.ExecWB(8,1)>
<input type=button value="复印本页" onclick=document.all.WebBrowser.ExecWB(6,1)>

第4、留意事项

在复印款式中,复印字体样式尺寸是以点(pt)来计的,显示屏上字体样式尺寸显示信息,象素(px)比点和英尺更适合。

在复印款式中,CSS的float特性有时将会会引发1些不便,会导致复印网页页面缺少,因此尽可能除去无须要块级显示信息。

有关复印设定,自定页眉、页脚,我查阅了1番材料,对此CSS和HTML没法操纵,只能根据启用ActiveX控制来完成,可是这样做躁动不安全。最好是方式是,复印前,你自身点一下访问器菜单开展复印设定。

CSS中也有1个能够设定分页查询符的标识:“page-break-after”和“page-break-before”。由于我的节日网页页面,报表较多,因此就沒有运用这个CSS,实际实际效果你自身实验吧。