2

我需要打印 A4 尺寸的 html 页面，另外我想打印内容正文打印以及 css、html 并忽略菜单列表、页眉、页脚和页面右侧菜单列表。

首先，我介绍了简单的 div 和类 noprint 并将其添加到 @media print 但它似乎不起作用。noprint 类在@media print 之外工作，所以我知道它是正确的。

另外我的要求是使用标准 Ctrl+P 键盘选项直接从浏览器打印

<style type="text/css">

    .standardStyle {
        display:block;
        width:200px;
        height:150px;
        padding:10px;
        background-color:green;
        margin:5px;
    }

    @media print{ 
     .noprint{ color:red;}
    }

</style>

</head>
<body>

<div class="noprint standardStyle">
    this is test line....
</div>

<div class="print standardStyle">
    this is test line....
</div>

<div class="print standardStyle">
    this is test line....
</div>

4

3 回答 3

4

运行代码段并点击 Ctrl+P ，您将看到红色的行。截屏 ：

在此处输入图像描述 

@media print {
       .noprint { color:red; }
 }
<div class="noprint">
        this is test line.....
</div>

于 2016-03-22T16:42:59.990 回答
2

大多数浏览器默认不打印背景颜色和背景图像。我想你错过了绿色背景 - 这就是它的原因。

通常这可以在浏览器的打印对话框中激活，但要强制打印背景，您只能尝试添加!important在打印中未正确显示的设置。

于 2016-03-22T16:51:01.783 回答
1 
@media print
{    
  .noprint{      
    display: none !important;        
  }      
}
于 2016-03-22T16:39:17.263 回答