`
xiasheng
  • 浏览: 70669 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

CSS控制打印

阅读更多
  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=打印      onclick=document.all.WebBrowser.ExecWB(6,1)>    
  44.   <input  type=button  value=直接打印  onclick=document.all.WebBrowser.ExecWB(6,6)>    
  45.   <input  type=button  value=页面设置  onclick=document.all.WebBrowser.ExecWB(8,1)>    
  46. </p>    
  47.   <p>    <input  type=button  value=打印预览  onclick=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>  
分享到:
评论

相关推荐

    css 打印不显示

    4. **页边距和分页**:通过CSS控制打印时的页边距和分页是很重要的。例如: ```css body { margin: 1cm; /* 设置页边距 */ } page-break-after: always; /* 在特定元素后强制分页 */ ``` 5. **字体和大小**:...

    JavaScript+CSS控制打印格式示例介绍

    首先,了解如何通过CSS控制打印格式。在HTML文档中,我们可以引用一个专门的CSS样式表,用来定义打印时才生效的样式规则。通过在标签的media属性中指定"print",这个样式表只会在打印时被加载和应用。 ```html ...

    CSS控制页面打印

    CSS控制页面打印,可分页

    打印不显示打印按钮及获取其他属性

    例如,开发者可能会分享如何通过JavaScript动态添加打印按钮,或者如何使用CSS控制打印样式,以及如何在打印前获取和设置打印参数的代码示例。 至于压缩包内的"打印页面中选取的连续部分.html"文件,这可能是一个...

    asp.net css控制打印功能方法实例

    总结来说,ASP.NET中控制打印功能主要依赖于CSS媒体查询和JavaScript。通过CSS的`@media print`,我们可以指定某些元素在打印时不显示,以优化打印输出。而JavaScript则提供了更多灵活性,允许自定义打印内容和布局...

    一种基于浏览器的自动小票机打印实现方案(js版)

    另一种更为先进的方法是使用CSS媒体查询和@media print规则来定义打印样式,通过纯CSS控制打印内容。 2. lodop:lodop是一个用于Web打印的JavaScript打印控件,支持在Web页面上实现套打和票据打印等功能。它提供了...

    javascript编写基于chrome浏览器的打印程序,本例用来打印小票.zip

    在JavaScript中,打印功能不仅可以使用`window.print()`,还可以通过CSS控制打印样式,确保小票的布局和样式在打印时保持一致。例如,可以添加针对打印的媒体查询(`@media print`)来调整页边距和隐藏不必要的元素: ...

    通过调用 JS 打印图片信息

    对于IE浏览器的页眉和页脚问题,IE提供了一种通过CSS控制打印样式的方法,可以移除不必要的页眉和页脚信息。在CSS中,我们可以添加以下规则: ```css @media print { @page { margin: 0; /* 移除页面边距 */ ...

    CSS参考手册打印版

    【CSS参考手册打印版】是一份综合性的教程资料,它基于W3school网站的CSS教程内容,方便用户下载打印成实体书以便随时查阅。这份手册旨在帮助读者掌握CSS(层叠样式表)的基础知识和应用技巧,从而更好地理解和管理...

    打印table表格数据

    开发者可以通过JavaScript或CSS控制打印样式,确保表格在打印时保持清晰、易读,并适应纸张布局。JavaScript文件可能包含了自定义的打印逻辑,比如筛选要打印的内容,调整列宽,或者添加页眉和页脚等。 对于压缩...

    javaweb实现打印功能

    在HTML代码中,可以通过CSS控制打印样式,确保打印出来的内容格式正确。 2. **JavaScript实现**:在JSP页面中引入JavaScript库,例如`window.print()`函数可以实现浏览器的默认打印功能。用户点击打印按钮时,调用...

    WEB页面打印

    开发者还可以通过JavaScript的`window.print()`方法触发打印,同时,通过CSS控制打印样式,比如隐藏不必要的元素、设置颜色模式等。 最后,"代码.txt"和"api"可能包含了具体的实现代码和打印相关的API。这些API可能...

    printTest01.rar_java 打印_javascript_javascript 打印

    它可能包含了如何利用JavaScript动态生成适合打印的HTML内容,以及如何通过CSS控制打印样式。例如,开发者可能创建了一个新的HTML结构,只包含要打印的内容,并在调用`window.print()`之前将其插入到DOM中。同时,...

    JS控制打印指定div(且控制css样式)的一种另类思路

    打印指定div的插件并不多,使用JPrintArea进行指定div打印也并不好控制,此段js代码是在他人基础上融入了自己的想法,经过测试,纸张打印出来的样式在多个浏览器(ie6、ie7、ie8、火狐、谷歌)上可以做到基本统一,...

    jsp、web打印功能Lodpo6.0

    - **自定义样式**:通过CSS控制打印内容的样式,以适应不同的打印需求。 **注意事项** 1. **兼容性问题**:确保Lodop服务在所有目标用户的浏览器上都能正常工作,特别是对IE和非IE浏览器的兼容性测试。 2. **安全...

    【ASP.NET编程知识】ASP.NET网页打印(只打印相关内容自写功能).docx

    - 使用CSS控制打印样式,例如字体大小、颜色、布局等,以适应打印介质。 - 考虑到不同浏览器的兼容性,可能需要对不同的浏览器(如Chrome、Firefox、IE)进行适配。 - 如果需要更复杂的打印功能,如预览、多页...

    LodopFuncs Web打印控件

    2. **打印样式控制**:利用CSS控制打印样式,确保网页在打印时的布局和视觉效果与屏幕显示一致。 3. **错误处理**:在调用打印函数后,应添加错误处理机制,以应对可能出现的网络、驱动等问题。 4. **跨平台兼容**...

Global site tag (gtag.js) - Google Analytics