作者:wasw100
网址:http://www.wasw100.com/html_js_css/page_print_summary.html
1.分页符的添加
.page_break{
page-break-after:always;
}
分页的时候加上:<div class="page_break"></div>
2.为使各个浏览器显示效果尽量一致,加上
*{
margin:0;
padding:0;
}
3.A4纵向打印,浏览器显示和打印效果相差不大,设置body的宽度
body{
width:640px;
font-size:12px;
}
4.css擅长样式的控制,table善于格式的显示。css修饰table
参考文章:http://www.w3schools.com/css/css_table.asp
table添加边框
table{
border-collapse:collapse;
}
table, th, td{
border:1px solid #000000;
}
如果一个页面有多个table,这个table和其他table格式略有不同,可以使用下面的方法
<div id="t1"> <table> <tr> <th scope="col"> </th> </tr> </table> </div>
css中,控制不同的格式
#t1 table{
width:640px;
}
#t1 table,#t1 th,#t1 td{
text-align:center;
}
5.控制打印时是否显示
@media print{<!--控制哪些打印,哪些不打印的样式-->
.print {display:block;}
.notPrint {display:none;}
}
我们在html中引入css: <link rel="stylesheet" type="text/css" media="screen" href="styles/basic.css" />
media="screen",也可以时media="print",分别代表控制浏览器里面的格式,或者打印时的格式,如果没有写media属性,则表示css既控制浏览器显示,有控制打印显示,
所以上面的css就是单独控制打印的
-- 文字间距 行间距
.space{
word-spacing:20px;
letter-spacing:20px;
line-height:60px;
}
--EOF--