@media print display：none无效

Question

我已经尝试了超过3个星期，不同的实现试图让正确的部分不显示，并让左侧部分以全宽显示。鉴于我的研究显示没有简单或简化的方法来快速渲染打印视图而不查看打印预览，我要求一些帮助来解决这个问题。

无效的打印媒体css是：

#gc {
    width: 100%;
}
#asideTrack {
/*      width: 100%;*/
    display: none;
}
.asideTrack {
/*      width: 100%;*/
    display: none;
}
.slideAside {
/*      width: 100%;*/
    display: none;
}
#slideAside {
    display:none
}

有什么建议吗？

Answer 1

在CSS下限规则覆盖顶部，如果它们具有相同的优先级（取决于选择器）

你在@media块中编写的常用css，它低于你的@media打印块，因此它会覆盖你的@media打印样式。例如，这就是为什么在打印预览中你的左块宽度为74％（因为这个规则比@media打印块的规则低，你说它是100％）。

我希望它有所帮助。

的解决方案 的

1. 在css文件中，您可以将介质打印块放在文件末尾。
2. 将!important指令添加到媒体打印块中的某些规则。即：  p {      颜色：红色！重要;  }
3. 将您的特殊css屏幕放在媒体屏幕块中。