打印页面时隐藏HTML div

时间:2012-08-31 15:15:26

标签: html css printing xhtml stylesheet

我有一个基于XHTML的页面,其中包含管理员信息。管理员应该能够打印页面,但我希望它隐藏他们的信息。

有没有办法在打印页面时设置打印区域,或者是单击“打印”按钮时打开没有管理员信息的辅助页面的唯一可行解决方案?

谢谢!

4 个答案:

答案 0 :(得分:26)

试试这个:

<style type="text/css" media="print">
.dontprint
{ display: none; }
</style>

<div class="dontprint">I'm only visible on the screen</div>

答案 1 :(得分:9)

您可以使用以下内容将该div的CSS设置为display: none

@media print {
    div.do-not-print {display: none;}
}

它会正常显示,但是当你去打印时,它会使用那个CSS类。

答案 2 :(得分:5)

将print.css添加到您隐藏所有不想要打印的元素的页面

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

media =“print”属性告诉浏览器使用特定的css文件。

在该文件中,您可以

.admindetails{
   display:none;
}

答案 3 :(得分:2)

当然,您可以添加不同的样式表进行打印,请参见下面的示例

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

或在退出样式表中,您可以添加媒体查询

@media print {
    .no-print {display: none;}
}

并添加.no-print类,您不想打印HTML元素