网页打印时强制分页

最新推荐文章于 2023-03-03 16:39:34 发布
最新推荐文章于 2023-03-03 16:39:34 发布
阅读量614 收藏
点赞数
原文链接：http://www.cnblogs.com/jybuding/archive/2010/05/07/1729521.html
版权

打印网页时，有时需要手动控制分页。范例代码如下：

 
 
<html>

 
 
 
 
<head>

 
 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

 
 
<title>收文日期</title>

 
 
<style type="text/css">

 
 
  .pbreak { PAGE-BREAK-AFTER: always }

 
 
  </style>

 
 
</head>

 
 
 
 
<body>

 
 
<table cellspacing="0" cellpadding="3" rules="all" bordercolor="#6B6969" border="1" id="DG_All" style="border-color:#6B6969;font-size:9pt;width:850px;">

 
 
 <THEAD style='display:table-header-group;'><tr align="Center" valign="Middle" style="font-weight:bold;">

 
 
  <td style="width:60px;">收文日期</td><td>来文单位</td><td>来文字号</td><td style="width:40px;">类别</td><td style="width:60px;">收文编号</td><td>文件题目</td><td style="width:20px;">份数</td><td style="width:60px;">处室</td><td style="width:60px;">签收人</td><td style="width:30px;">　</td>

 
 
 </tr></THEAD><tr align="Center" valign="Middle">

 
 
  <td>2003-02-17</td><td>a</td><td>[2003]3号</td><td>市内局</td><td>[2003]5</td><td>

 
 
  aaa</td><td>1         </td><td>a室</td><td>　</td><td>　</td>

 
 
 </tr><tr align="Center" valign="Middle">

 
 
  <td>2003-02-17</td><td>b</td><td>[2003]3号</td><td>请示</td><td>[2003]11</td><td>

 
 
  bbb</td><td>1         </td><td>b处</td><td>　</td><td>存查</td>

 
 
 </tr><tr align="Center" valign="Middle">

 
 
  <td>2003-02-14</td><td>c</td><td>第2号</td><td>请示</td><td>[2003]20</td><td>

 
 
  ccc</td><td>1         </td><td>c处</td><td>　</td><td>　</td>

 
 
 </tr><tr align="Center" valign="Middle" style="PAGE-BREAK-AFTER:always;">

 
 
  <td>2003-02-11</td><td>d</td><td>[2003]19号</td><td>市内局</td><td>[2003]3</td><td>

 
 
  ddd</td><td>1         </td><td>d处</td><td>　</td><td>　</td>

 
 
 </tr><tr align="Center" valign="Middle">

 
 
  <td>2003-02-10</td><td>e</td><td>[2003]19号</td><td>市内局</td><td>[2003]3</td><td>

 
 
  eee</td><td>1         </td><td>e处</td><td>　</td><td>　</td>

 
 
 </tr><tr align="Center" valign="Middle">

 
 
  <td>2003-02-17</td><td>f</td><td>[2003]3号</td><td>请示</td><td>[2003]11</td><td>

 
 
  fff</td><td>1         </td><td>f处</td><td>　</td><td>存查</td>

 
 
 </tr><tr align="Center" valign="Middle">

 
 
  <td>2003-02-17</td><td>g</td><td>[2003]3号</td><td>请示</td><td>[2003]11</td><td>

 
 
  ggg</td><td>1         </td><td>g处</td><td>　</td><td>存查</td>

 
 
 </tr>

 
 
 <tfoot style='display:table-footer-group;'><tr align="Center" valign="Middle" style="font-weight:bold;">

 
 
  <td colspan="10">这里可以写页码</td>

 
 
 </tr></tfoot>

 
 
</table>

 
 
</body>

 
 
 
 
</html>
 

 

转载于:https://www.cnblogs.com/jybuding/archive/2010/05/07/1729521.html

                

        

        




    

  


    

      

        

            

              
                
                  weixin_30628801
                
              
            

            

                关注
              
            

        

        

          
      

      









                



	

		

			

				
					
JS 实现分页打印功能

				
			

			

				

					01-19
				

			

		

		

			
				
在调用window.print()时，可以实现打印效果，但内容太多时要进行分页打印。 在样式中有规定几个打印的样式 page-break-before和page-break-after CSS属性并不会修改网页在屏幕上的显示，这两个属性是用来控制文件的...

			
		

	



                

              
                



	

		

			

				
					
html打印强制分页

				
			

			

				

					JeffanChen的博客
				

				

					08-31
					
					2153
					
				

			

		

		

			
				
如下是强制打印三页的例子
<div style="page-break-after: always;">
//一页里的内容
</div>
<div style="page-break-after: always;">
//一页里的内容
</div>
<div style="page-break-after: always;">
//一页里的内容
</div>

如果有帮助到你，点个赞好嘛！！！

...

			
		

	



                


  
              

                


	

		

			

				
					
html网页打印实现强制分页

				
			

			

				

					qq_28134525的博客
				

				

					11-30
					
					1064
					
				

			

		

		

			
				
只要在需要分页的地方加上一行代码


<divstyle="page-break-after:always;"></div>


效果如下：






			
		

	





	

		

			

				
					
学习web打印以及强制分页

				
			

			

				

					imthekingofthe的博客
				

				

					03-03
					
					1017
					
				

			

		

		

			
				
在元素后面插入页分割符直到它到达一个空白的左页边。：在元素后面插入页分割符直到它到达一个空白的右页边。具体配置如下，也可以传入配置对象，具体请查看官网。css属性：page-break-after。：避免在元素后出现页分割符。：使用与父元素相同的属性值。：强制在元素后出现页分割符。：对页面分割没有影响。

			
		

	



		

			
		



	

		

			

				
					
html页面打印强制换页

				
			

			

				

					spring_007_999的博客
				

				

					03-02
					
					585
					
				

			

		

		

			
				
前端打印强制换页

			
		

	





	

		

			

				
					
jQuery打印指定区域Html页面并自动分页

				
			

			

				

					10-25
				

			

		

		

			
				
例如，如果你想在某个`div`之后强制分页，可以在该`div`上添加样式：  ```css ;"> ```  尽管如此，有时候即使使用CSS控制分页，也可能出现连续打印的情况。这时，`jQuery.PrintArea.js`插件提供的属性参数就派上用场...

			
		

	





	

		

			

				
					
CSS实现强制浏览器分页

				
			

			

				

					09-27
				

			

		

		

			
				
在使用CSS进行分页时，还需要考虑以下几点优化策略： 1. 适当使用`page-break-inside: avoid`，这会避免元素被分页符分割。 2. 对于连续的多个分页元素，可以合并成一个类，减少CSS规则的重复。 3. 在不影响内容布局...

			
		

	





	

		

			

				
					
打印自动分页.zip

				
			

			

				

					06-21
				

			

		

		

			
				
例如，我们可以创建针对打印的CSS规则，通过`@media print`来控制打印时的样式，包括页面分页。  ```css @media print {  /* 在这里定义打印样式，如分页控制 */ } ```  接下来，我们讨论JS如何参与分页。JavaScript...

			
		

	





	

		

			

				
					
调用 window.print 打印函数，如果html内容有 page-break-after 属性，则打印预览页面会出现内容被强制分页。

				
			

			

				

					冻死的企鹅
				

				

					02-23
					
					470
					
				

			

		

		

			
				
如果用 window.print 打印函数，则被打印的Html内容不要设置属性 page-break-after: always。否则会出现下列效果，内容被强制分页了。

			
		

	





	

		

			

				
					
打印分页，html强制分页

				
			

			

				

					09-25
				

			

		

		

			
				
打印分页，html强制分页，一个表格一页，可以查看打印预览

			
		

	





	

		

			

				
					
html打印分页自带表头表尾

				
			

			

				

					05-14
				

			

		

		

			
				
需要自己写打印程序时，会遇到打印分页都需有表头表尾的问题，html打印分页自带表头表尾，可以参考学习下

			
		

	





	

		

			

				
					
jQuery自动分页打印表格(HTMLtable)，可以强制换页

				
			

			

				

					weixin_33970449的博客
				

				

					02-25
					
					1672
					
				

			

		

		

			
				
最近做项目的时候需要做批量打印订单，一个订单可能在最后一页是的内容是不足一页的，这时候下一个订单需要下一页打印，这样就需要强制换页。在下一页再打印下一个订单
部分代码：
部分重要的css是分页的换页的关键：

 1     &lt;style type="text/css"&gt;
 2         @media print
 3         {
 4            ...

			
		

	





	

		

			

				
					
html网页怎么分页打印,web如何实现页面分页打印

				
			

			

				

					weixin_42510962的博客
				

				

					06-21
					
					3867
					
				

			

		

		

			
				
实现页面分页打印是很多小伙伴们都想知道的，那么你知道web如何实现页面分页打印的具体方法吗？下面就让爱站小编带领大家一起去学习学习吧，希望本文对你有所帮助。1．首先引入一个WebBrowser在需要打印的页面，可以直接添加：???到页面，或者使用JavaScript在需要的时候临时添加也可以：???document.body.insertAdjacentHTML("beforeEnd","clas...

			
		

	





	

		

			

				
					
简单的WEB打印分页设置

				
			

			

				

					shaily读书学习
				

				

					07-16
					
					1193
					
				

			

		

		

			
				
在讲述如何分页打印之前，我们有必要先了解一下css中不为人知的一些用法。　　css里media的使用　　我们在网页里引用外部的css文件时，通常是用如下的代码：　　  　　实际上，上面的link对象里，我们是省略了一个叫“media”的属性，这个属性指定样式表规则用于指定的设备类型。它有如下值可用：　　all-- 用于所有设备类型　　aural-- 用于语音和音乐合成器

			
		

	





	

		

			

				
					
html自动分页浏览器,CSS实现强制浏览器分页

				
			

			

				

					weixin_29039773的博客
				

				

					06-04
					
					390
					
				

			

		

		

			
				
CSS实现强制浏览器分页互联网  发布时间：2009-04-02 19:33:29  作者：佚名   我要评论网页制作Webjx文章简介：CSS相对比较弱，例如： 自动分页， 就基本没啥实际用途。我们通常需要自己在需要的时候，强制浏览器分页.虽然webjx.com向大家介绍了很多CSS属性的相关知识，但有些非常冷门的属性还是有所欠缺。在B/CSS相对比较弱，例如： 自动分页， 就基本没啥实际...

			
		

	





	

		

			

				
					
学Excel，办公不求人

				
			

			

				

					02-17
				

			

		

		

			
				
本课程主要涵盖Excel操作技巧、单元格操作技巧、工资条设置、公式函数及图表、文件管理、打印设置等，通过一线工作案例，全面讲解Excel技巧和经验，能帮助学员提升Excel技能，提高工作效率。

			
		

	





	

		

			

				
					
打印Html页面自动分页

					
热门推荐

				
			

			

				

					Peak Xin's Blog
				

				

					05-22
					
					2万+
					
				

			

		

		

			
				
在想要分页的地方添加一行代码即可<div style="page-break-after: always;"></div>添加后用chrome浏览器用js代码调用打印function preview()
    {
        bdhtml=window.document.body.innerHTML;//获取当前页的html代码
        sprnstr="<!--startprint-

			
		

	





	

		

			

				
					
谷歌浏览 打印无法分页 page-break-after: always

				
			

			

				

					dapinxiaohuo的专栏
				

				

					11-30
					
					1万+
					
				

			

		

		

			
				
在使用chrome打印时，页面上用float并列排放DIV，用page-break-after: always;控制打印分页，发现第一页打印正常，之后就失去分页作用。去掉float打印分页就正常，两者不能同时使用。
研究后发现，可以使用display:inline-block;代替float，来解决chrome下两者冲突。

			
		

	





	

		

			

				
					
html打印打印强制分页

					
最新发布

				
			

			

				

					04-01
				

			

		

		

			
				
在HTML中，可以使用CSS的page-break-before和page-break-after属性来控制打印时的强制分页。

例如，要在打印时在某个元素之前强制分页，可以使用以下CSS代码：

```
@media print {
  .page-break-before {
    page-break-before: always;
  }
}
```

然后在HTML中，使用class="page-break-before"来标记需要强制分页的元素：

```
<div class="page-break-before">
  <!-- 这里是需要强制分页的内容 -->
</div>
```

同样的，如果需要在某个元素之后强制分页，可以使用page-break-after属性：

```
@media print {
  .page-break-after {
    page-break-after: always;
  }
}
```

```
<div class="page-break-after">
  <!-- 这里是需要强制分页的内容 -->
</div>
```

需要注意的是，这些属性只在打印时生效，不会影响页面的显示。另外，不同浏览器的打印效果可能有所不同，需要进行测试和调整。

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值