CSS控制打印

最新推荐文章于 2024-03-19 16:13:00 发布
最新推荐文章于 2024-03-19 16:13:00 发布
阅读量388 收藏
点赞数
分类专栏： Web打印 文章标签： CSS Microsoft HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiasheng/article/details/83354503
版权
  1. <html>    
  2. <head>    
  3. <meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">    
  4. <title>CSS打印控制</title>    
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    
  6. <!--media=print 这个属性可以在打印时有效-->    
  7. <style media=print>    
  8. .Noprint{display:none;}    
  9. .PageNext{page-break-after: always;}    
  10. </style>    
  11.   
  12. <style>    
  13. .tdp    
  14. {    
  15.     border-bottom: 1 solid #000000;    
  16.     border-left:  1 solid #000000;    
  17.     border-right:  0 solid #ffffff;    
  18.     border-top: 0 solid #ffffff;    
  19. }    
  20. .tabp    
  21. {    
  22.     border-color: #000000 #000000 #000000 #000000;    
  23.     border-style: solid;    
  24.     border-top-width: 2px;    
  25.     border-right-width: 2px;    
  26.     border-bottom-width: 1px;    
  27.     border-left-width: 1px;    
  28. }    
  29. .NOPRINT {    
  30. font-family: "宋体";    
  31. font-size: 9pt;    
  32. }    
  33.   
  34. </style>    
  35.   
  36. </head>    
  37.   
  38. <body >    
  39. <center class="Noprint" >    
  40.   <p>    
  41.   <OBJECT  id=WebBrowser  classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2  height=0  width=0>    
  42.   </OBJECT>    
  43.   <input  type=button  value=打印      οnclick=document.all.WebBrowser.ExecWB(6,1)>    
  44.   <input  type=button  value=直接打印  οnclick=document.all.WebBrowser.ExecWB(6,6)>    
  45.   <input  type=button  value=页面设置  οnclick=document.all.WebBrowser.ExecWB(8,1)>    
  46. </p>    
  47.   <p>    <input  type=button  value=打印预览  οnclick=document.all.WebBrowser.ExecWB(7,1)>    
  48.     
  49.    </p>    
  50.   <hr align="center" width="90%" size="1" noshade>    
  51. </center>    
  52.   
  53. <table width="90%" border="0" align="center" cellpadding="2" cellspacing="0"  class="tabp">    
  54. <tr>    
  55. <td colspan="3" class="tdp">第1页</td>    
  56.     </tr>    
  57. <tr>    
  58.   <td width="29%" class="tdp"> </td>    
  59.   <td width="28%" class="tdp"> </td>    
  60.       <td width="43%" class="tdp"> </td>    
  61.   </tr>    
  62. <tr>    
  63.   <td colspan="3" class="tdp"> </td>    
  64.   </tr>    
  65. <tr>    
  66.   <td colspan="3" class="tdp"><table width="100%"  border="0" cellspacing="0" cellpadding="0">    
  67.         <tr>    
  68.           <td width="50%" class="tdp"><p>这样的报表</p>    
  69.           <p>对一般的要求就够了。</p></td>    
  70.           <td> </td>    
  71.         </tr>    
  72.       </table></td>    
  73.   </tr>    
  74. </table>    
  75. <hr align="center" width="90%" size="1" noshade class="NOPRINT" >    
  76. <!--分页-->    
  77. <div class="PageNext"></div>    
  78. <table width="90%" border="0" align="center" cellpadding="2" cellspacing="0"  class="tabp">    
  79.   <tr>    
  80.     <td class="tdp">第2页</td>    
  81.   </tr>    
  82.   <tr>    
  83.     <td class="tdp">看到分页了吧</td>    
  84.   </tr>    
  85.   <tr>    
  86.     <td class="tdp"> </td>    
  87.   </tr>    
  88.   <tr>    
  89.     <td class="tdp"> </td>    
  90.   </tr>    
  91.   <tr>    
  92.     <td class="tdp"><table width="100%"  border="0" cellspacing="0" cellpadding="0">    
  93.         <tr>    
  94.           <td width="50%" class="tdp"><p>这样的报表</p>    
  95.               <p>对一般的要求就够了。</p></td>    
  96.           <td> </td>    
  97.         </tr>    
  98.     </table></td>    
  99.   </tr>    
  100. </table>    
  101. </body>    
  102. </html>  
xiasheng
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css打印适应纸张_css控制打印样式
weixin_42588555的博客
12-31 1189
显示器(screen)和打印机(printer)是两种差别很大的设备,所以从浏览器里看到的页面,打印出来也许和你看到的样子有很大的差距。screen一般使用逻辑单位比如px,而打印机则应该使用物理单位比如cm或in。我们常见的A4纸张大小在不同DPI的显示器上显示的大小是不同的。因此如果要精确的控制打印效果就应该使用printcss，这是跨平台兼容的标准。不推荐使用浏览器插件方式实现打印。web打...
CSS控制打印的样式设计
qq_22552085的博客
03-08 4157
@page规则控制打印设置选项1.使用@page规则可以对打印进行更多的设置，比如指定页面的尺寸，页边距,页眉页脚等。2.纸张大小设置:    （设置纸张大小,5.5英寸宽,8.5英寸高。）@page {  size: 5.5in 8.5in;}通过别名控制纸张大小,如"A4"或“legal.”@page {  size: A4;}通过控制打印方向，portrait： 纵向打印地,  landsc...
打印样式CSS的技巧和要点介绍
hdxx2022的博客
03-04 905
另一方面即使人们只是偶尔需要打印的东西从网站，这将是理想的，如果页面设计适合的打印机，就像现代的网站适应各种屏幕尺寸和设备。从理论上讲，你可以使用一个CSS sprite 之间进行切换不同版本的打印的标志，但是这将意味着增加一倍的文件大小可能没有什么好处。重新针对打印写CSS样式是没有必要的，我们只需要针对差异设置打印的样式覆盖掉之前的默认样式。如果直接打印，超链接将只是一点文字，而不会出现链接的网址，这样来说，是没有意义的。链接周围图像是比较麻烦的，理想的情况是图像周围的链接将有一个class。
css打印经验总结
weixin_43842373的博客
12-16 2178
css打印样式和javascript打印API逻辑
通过html和css实现打印分页控制
crazyXB的博客
12-25 2351
通过html和css实现打印分页控制，用到的属性为page-break-before和page-break-after
关于CSS 打印你应该知道的样式配置
HaiJun_Aion的博客
10-24 1355
昨天在做一些打印的需求，遇到了一些小坑，记录分享一下。
asp.net css控制打印功能方法实例
10-26
总结来说，ASP.NET中控制打印功能主要依赖于CSS媒体查询和JavaScript。通过CSS的`@media print`，我们可以指定某些元素在打印时不显示，以优化打印输出。而JavaScript则提供了更多灵活性，允许自定义打印内容和布局...
JavaScript+CSS控制打印格式示例介绍
10-26
用media="print"的css来控制要打印的文件，media为print的样式，表示打印时该样式才起作用，下面为大家详细介绍下，感兴趣的朋友不要错过
CSS控制漂亮的网页打印效果示例代码
09-25
这些属性可以帮助你更精确地控制打印布局，避免重要内容被分割。 为了创建更精细的打印样式，还可以调整以下方面： - **字体和颜色**：在打印模式下，可能需要调整字体大小和颜色以适应纸质媒介，因为打印机和屏幕...
打印样式CSS的技巧和要点
xinyuerr的博客
10-17 237
另一方面即使人们只是偶尔需要打印的东西从网站，这将是理想的，如果页面设计适合的打印机，就像现代的网站适应各种屏幕尺寸和设备。从理论上讲，你可以使用一个CSS sprite 之间进行切换不同版本的打印的标志，但是这将意味着增加一倍的文件大小可能没有什么好处。重新针对打印写CSS样式是没有必要的，我们只需要针对差异设置打印的样式覆盖掉之前的默认样式。如果直接打印，超链接将只是一点文字，而不会出现链接的网址，这样来说，是没有意义的。链接周围图像是比较麻烦的，理想的情况是图像周围的链接将有一个class。
在VS.NET(ASP.NET)下创建文件上载控件
丰空岛主(Vega Prime,Android,LabWindows,ThreeJS,Python,OpenCV）
07-09 1313
前言：还记得在asp3.0里，我们为了上载文件可真是煞费苦心，写了一大堆的代码，可执行起来还是那么慢。但在asp.net里这个问题可以轻松搞定，这篇文章我们就探讨如何建立一个用户自定义的文件上载控件，并在我们的.ASPX程序中使用它。正文第一步：开发自定义文件上载控件打开VS.NET，建立一个工程：WebApp，我们使用WebApp项目来做我们的工作。在项目WebApp上点右健选择Add下的Add
html css print打印，打印样式
qq_41974199的博客
01-30 5132
html css print打印，打印样式
html设置打印规则,css @page规则控制打印设置选项
weixin_42485489的博客
06-10 4284
关于css控制打印更多内容可以参阅css控制打印内容的样式一章节。使用@page规则可以对打印进行更多的设置，比如指定页面的尺寸。页边 距,页眉页脚等，以求达到更好的效果。下面做一下简单介绍。一.纸张大小设置:@page {size: 5.5in 8.5in;}设置纸张大小,5.5英寸宽,8.5英寸高。@page {size: A4;}通过别名控制纸张大小,如"A4"或“legal.”@page ...
打印样式CSS的技巧和要点浅谈
最新发布
hdxx2022的博客
03-19 206
另一方面即使人们只是偶尔需要打印的东西从网站，这将是理想的，如果页面设计适合的打印机，就像现代的网站适应各种屏幕尺寸和设备。从理论上讲，你可以使用一个CSS sprite 之间进行切换不同版本的打印的标志，但是这将意味着增加一倍的文件大小可能没有什么好处。重新针对打印写CSS样式是没有必要的，我们只需要针对差异设置打印的样式覆盖掉之前的默认样式。如果直接打印，超链接将只是一点文字，而不会出现链接的网址，这样来说，是没有意义的。链接周围图像是比较麻烦的，理想的情况是图像周围的链接将有一个class。
2.css打印分页（随手记录）
qq_35491739的博客
08-11 3633
分页的话使用的css样式一般是page-break-before与page-break-after这两个，对应的是打印前分页与打印后分页。 page-break-before 在元素前分页 page-break-after 在元素后分页 page-break-inside 元素内部分页 打印属性可以控制分页方向，可以设定4种设定值：auto、always、left和right。其中Auto是默认值，只有在有需要时，才需设定分页符号，以page-brea...
css设置打印样式@page
热门推荐
qq_42351675的博客
04-25 1万+
浏览器打印 浏览器自带的打印功能很早之前就有了，所以基本所有浏览器都支持。 我们通过 window.print() 、document.execCommand('print’) 、页面右键菜单打印等方式都可以调起打印。 不同浏览器的区别：在Safari和Chrome都会弹起打印预览的窗口，FireFox没有预览而是直接让你选择打印机，OSx下可以通过预览PDF来预览~ 但是直接使用浏览器打印虽然省事，但是存在很多问题，无法满足我们的打印需求： 打印的是整个网页，不能打印局部内容； 打印不..
css a4 打印
05-24
在 CSS 中设置 A4 打印格式可以使用以下代码： ```css @media print { @page { size: A4; } } ``` 这段代码使用 `@media print` 媒体查询来针对打印时的样式设置。`@page` 规则用于定义打印页面的属性，包括...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值