@media print css doesnot给出了期望输出

我使用@media print和@media屏幕进行打印。对于@media屏幕，它工作正常，但对于@media打印，它不会将虚线表格显示为屏幕。@media print css doesnot给出了期望输出

@media screen{ 
    body{ 
     font-family:"Courier New", Courier, monospace; 
     font-size:13px; 
    } 
    .f1{ 
     text-transform:uppercase; 
     display:block; 
     text-align:center; 
    } 

    .f2{ 
     text-transform:uppercase; 
     display:block; 
     margin-left:10px; 
    } 

    .border_bottom{ 
     border-bottom:2px dashed #000; 
    } 
    .border_top{ 
     border-top:2px dashed #000; 
    } 

    .body_table{ 
     border:1px dashed #CCCCCC; 
     padding:.5em; 
    } 
} 

    @media print { 
      body { 
       font: 12pt georgia,serif; 
      } 

      h1 { 
       font-size: 18pt; 
      } 

    h2 { 
     font-size: 15pt; 
     color: #000; 
    } 

       .border_bottom{ 
     border-bottom:2px dashed #000; 
    } 
    .border_top{ 
     border-top:2px dashed #000; 
    } 

    .body_table{ 
     border:1px dashed #CCCCCC; 
     padding:.5em; 
      } 
     }

通过上面的这些代码，@media屏幕可以正常工作，因为我认为。即我可以看到带有虚线边框的帐单，但是在打印部分，虚线边框不起作用并且未显示。账单在桌子上，当我打印桌子时也看不到。

我的HTML代码

<body > 
    <form id="form1" runat="server"> 
    <div id="divprint"> 
     <table> 
      <tr> 
       <td>name</td> 
      </tr> 
      <tr> 
       <td>Roll</td> 
      </tr> 
     </table> 

    </div> 
     <asp:button runat="server" ID="btn_prnt" OnClientClick="CallPrint('divprint')" Text="Print" /> 
    </form> 
</body>

注：我使用Waterfox 18.0.1的browers。

来源

2013-04-10 Bhim Prasad Ale

如果您还发布了一段HTML代码，并与给定的CSS一起使用会更好。这将有助于我们更好地了解您的情况，并且可能会有人能够告诉您如何解决问题。 – 2013-04-10 07:59:43

此外，具体说明您用于测试目的的浏览器也是有益的。 – seemly 2013-04-10 08:03:14

您提供的HTML不包含.border_top和.body_table元素。因此，没有边界。请通过http://codepen.io或http://jsbin.com分享有效的CSS和HTML。

当准备打印页面时，浏览器会删除一些装饰。在大多数浏览器中都会删除背景。也许边界也被删除？

来源

2013-04-11 06:54:23

我在媒体屏幕和medai打印上使用.border_top和.body_table。我必须在html上使用.border_top和.body_table吗？ – 2013-04-11 07:07:34

CSS应用于HTML元素。如果您使用不与任何HTML元素相对应的CSS选择器，则这些选择器背后的样式不会应用于任何位置。 PS不要忘记注册并选择答案。 – 2013-04-11 10:14:22

@media print css doesnot给出了期望输出

回答

相关问题