打印：如何隐藏元素和包含要打印的元素

Question

当用户想要打印页面时，元素应该隐藏在媒体屏幕中，同时包含它。

我使用这个CSS代码但不起作用。

@media screen {
    th .hide {
      display: none;
    }
}

@media print {
    th .hide {
        border: 1px solid #000; 
        padding: 0.5em;
    }
}

html是这样的：

<table>   
    <tr>
        <th class="hide" > Office:    
    </tr>
</table>

Answer 1

Here类似帖子

最佳做法是使用专门用于打印的样式表，并将其媒体属性设置为打印。

在其中，显示/隐藏您要在纸上打印的元素。

<link rel="stylesheet" type="text/css" href="print.css" media="print" />