CSS中的样式不适用于打印DIV

在CSS中，样式通常用于控制网页的外观和布局。然而，有时候我们希望在打印网页时应用不同的样式，以确保打印输出的内容更适合纸质媒体。

要在打印时应用不同的样式，可以使用CSS的@media规则和print媒体类型。通过在样式表中定义@media print规则，可以指定在打印时应用的样式。

下面是一个示例，展示如何在打印时应用不同的样式：

@media print {
  /* 在这里定义打印时应用的样式 */
  body {
    font-size: 12pt;
  }
  .print-only {
    display: block;
  }
  .no-print {
    display: none;
  }
}

在上面的示例中，我们使用@media print规则来定义打印时应用的样式。在这个规则内部，我们可以定义各种样式，例如修改字体大小、隐藏或显示特定元素等。

为了在打印时应用样式，我们可以为需要特殊处理的元素添加相应的类名。在上面的示例中，我们定义了.print-only和.no-print两个类名。.print-only类名用于在打印时显示元素，而.no-print类名用于在打印时隐藏元素。

使用示例：

<div>
  <p>这是一个普通的段落。</p>
  <p class="print-only">这个段落只在打印时显示。</p>
  <p class="no-print">这个段落只在打印时隐藏。</p>
</div>

在上面的示例中，我们为第二个段落添加了.print-only类名，以便在打印时显示该段落。而第三个段落则添加了.no-print类名，以便在打印时隐藏该段落。

推荐的腾讯云相关产品和产品介绍链接地址：

• 腾讯云CSS样式管理：https://cloud.tencent.com/product/css
• 腾讯云云服务器CVM：https://cloud.tencent.com/product/cvm
• 腾讯云云函数SCF：https://cloud.tencent.com/product/scf
• 腾讯云云数据库CDB：https://cloud.tencent.com/product/cdb
• 腾讯云对象存储COS：https://cloud.tencent.com/product/cos
• 腾讯云人工智能AI：https://cloud.tencent.com/product/ai
• 腾讯云物联网IoT Hub：https://cloud.tencent.com/product/iothub
• 腾讯云移动开发MPS：https://cloud.tencent.com/product/mps
• 腾讯云区块链BCS：https://cloud.tencent.com/product/bcs
• 腾讯云元宇宙：https://cloud.tencent.com/product/mu