CSS打印 @media规则

您可以使用CSS来改变网页在打印纸上的外观。您可以为屏幕版本和打印版本分别指定不同的字体。

您在前几个章节中已经看到了@media规则。这个规则允许您为不同的媒体指定不同的样式。因此，您可以为屏幕和打印机定义不同的规则。

下面的示例为屏幕和打印指定了不同的字体族。下面的CSS使用相同的字号来适应屏幕和打印。

<style type = "text/css">
   <!--
      @media screen {
         p.bodyText {font-family:verdana, arial, sans-serif;}
      }

      @media print {
         p.bodyText {font-family:georgia, times, serif;}
      }
      @media screen, print {
         p.bodyText {font-size:10pt}
      }
   -->
</style>

如果您正在单独文件中定义样式表，那么在链接到外部样式表时，您也可以使用媒体属性 –

<link rel = "stylesheet" type = "text/css" media = "print" href = "mystyle.css">