js打印内容隐藏,media="print" 只在打印的时候显示该内容

Posted 天马3798

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js打印内容隐藏,media="print" 只在打印的时候显示该内容相关的知识,希望对你有一定的参考价值。

<style media="print">、<link media="print">的用法合理应用,media="print"是不被网页所显示的,只能在打印的效果上存在,可以设置出打印效果和在网页上所显示的不一样。
 
例:打印出来的字体和网页是不同的
// 设置显示器用字体尺寸 @media screen { BODY {font-size:12pt; } } 

// 设置打印机用字体尺寸 @media print { @import "print.css" BODY {font-size:8pt;} } 

或者<style media="print">body{font-size:12px;}</style>
 
实例:
<head>
<style>
  .none { display:none;}
</style>
<style media="print">.none { display:block;}</style>
</head>
 
<body>
<h1>media="print" 实例</h1>
<p>在网页里面是可以看见我的</p>
<p class="none" media="print" >在网页里看不见我,打印出来你就可以看见我啦! ^_^  ( 此页面会通过 media="print" 样式表进行格式化。 )</p>
</body>
</html>
 
 

以上是关于js打印内容隐藏,media="print" 只在打印的时候显示该内容的主要内容,如果未能解决你的问题,请参考以下文章

打印预览隐藏表格边框

有内容就显示 没内容就隐藏的JS判断代码

如何在下一页打印PDF后拆分表格行并删除标题内容颜色?

使用 @media print 使嵌入式 Soundcloud 缩略图可打印

jQuery点击当前元素显示其他元素隐藏

如何用JS判断div中内容为空,当为空时隐藏div