CSS媒体：打印包含屏幕上未显示的内容？

Question

我有以下

 @media print { DIV { display: block; } }

 <html> <body> <div style="display:none">You can't see me!</div> </body> </html>

但是当我尝试此操作时，我仍然看不到“您看不到我！” 当我打印时。 我怎样才能显示出来进行打印？

Answer 1

为您的div分配一个类，以便您可以指定在打印时需要看到的内容：

<html>
    <body>
        <div class="print-only">You can't see me!</div>
    </body>
</html>

然后，您的CSS将如下所示：

.print-only {
    display: none;
}
@media print {
  .print-only {
    display: block !important;
  }
}

Answer 2

首先，从您的代码中，我可以看到您使用内联display: none样式display: none 。 这将阻止div显示。 删除内联样式以更正此问题。