为屏幕而不是打印媒体切换 CSS 显示 [重复]

Question

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

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

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

Answer 1

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

@media print {
  #zoom {
    display: none !important;
  }
}