page-break-after:always; 打印时不分页的问题 仅有一页时打印多一页

page-break-after:always;使用window.print()预览时

1 打印时不分页的问题

   设置该css的必须是块级元素（block），其他（inline 和inline-block ）均能分页

2 仅有一页时打印多一页的问题

  a.设置 :last-child  {

page-break-after:avoid}

 b.若还是无效，则设置body高度<100% ,如（99.5%）

例子：

 

 1 <html>
 2 <head>
 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 4 <meta http-equiv="x-ua-compatible" content="IE=8; IE=11">
 5 
 6 <script type="text/javascript" src="/framework/jQuery/jquery-1.10.2.min.js"></script>
 7 
 8 
 9 <title>asdf</title>
10 
11 <style>
12 .divide {
13 page-break-after:always;
14 background-color:green;
15 
16 }
17 .divide:last-child {
18 page-break-after:avoid;
19 background-color:red;
20 
21 }
22 
23 body {
24 margin: 0px auto;
25 padding: 0px;
26 }
27 </style>
28 
29 </head>
30 <body><input type="button" value="印刷" name="btnPrint" onclick="window.print()" class="fwWiz_DicObj fwFocusField" fwfocusinvalue="印刷">
31 <table class="divide">11</table>
32 
33 <table class="divide">22</table>
34 <div class="divide">1</div>
35 
36 <div class="divide">2</div>
37 <footer></footer>
38 </body>
39 </html>

 

posted @ 2022-09-16 09:34  飘雪飞阳  阅读(1705)  评论(0)    收藏  举报