切换屏幕的 CSS 显示，但不切换打印媒体

Toggling CSS display for screen but not print media

本文关键字：媒体 打印 显示 屏幕 CSS      更新时间：2023-09-26

我有这个html：<div id="zoom">...</div> .加载页面时，我将其设置为"显示：无"。当触发某个事件时，"缩放"ID设置为"显示：块"。但是，我希望如果用户打印页面，即使在触发该特定事件之后，它也永远不会打印"缩放"ID中的内容。该事件将其设置为通过 jQuery 阻止：

$("#zoom").css({"display":"block"});

有没有办法在jQuery中定义它应该只应用于屏幕媒体？上面的代码在所有媒体类型中设置它。

除非我误解了这个问题，否则您应该能够只使用媒体查询进行打印。 唯一奇怪的补充是您可能必须使用 !important 规则，因为该元素是使用 javascript （大概是内联样式）可见的。

@media print {
  #zoom {
    display: none !important;
  }
}
相关文章：