外部print.css文件 - 如何使元素仅在打印时可见,在屏幕上不可见？

Question

我目前使用以下作为我的外部print.css文件:

/*删除不需要的元素*/

hiddened,#hiddenbuttons,#header,#nav,.propertyselector,li.hiddentab,ul.hiddentab {display:none; }

/*确保内容跨越整个宽度*/

container,#container2,#content {width:100%; 保证金:0; float:none; }

/*将文字颜色更改为黑色(适用于深色背景上的浅色文字)*/.lighttext {color:#000}

/*提高链接的色彩对比度#781351*/a:链接,a:已访问{颜色:#000}

我理解这是如何使display:none对于我不想在页面上打印的项目.我的问题是:我该怎么做呢？如果页面上有元素我只想在页面打印时可见,在查看页面时不可见,我该怎么办？

有任何想法吗？谢谢.

Answer 1

简单的说

.onlyprint {display: none;}
@media print {
  .onlyprint {display: block;}
}

进入你的CSS规则.