样式“显示：阻止”可以否决媒体打印 CSS 的“显示：无”？

Question

这是一个 HTML 元素：

<div id="cboxOverlay" style="display: block; opacity: 0.9; cursor: pointer;" class="price_match_no_print"></div>

这是一些 CSS：

@media print {
    .price_match_no_print {
        display:none;
    }
}

现在当我打印页面时，上面的 HTML 元素会出现在打印上？

样式display: block 是否会推翻@media print 的display: none？

Answer 1

@media 规则本身没有任何特殊性，因为您通过内联样式添加 CSS 规则，它们将始终覆盖任何未使用 !important 规则的外部样式。所以在这种情况下，你唯一的选择是：

@media print {
    .price_match_no_print {
        display:none !important;
    }
}