2008年8月28日木曜日

CSS で印刷するときに特定の要素を消す

CSS を指定する中において、 CSS の要素を

@media print { }

の中に記述する。

 

以下は、ブラウザ上では全て表示されるが、印刷、または印刷プレビューにて確認すると、「あーあーあー」が表示されなくなる。

<html>
  <head>
    <title></title>

    <style type="text/css">
    <!--
    @media print {
        .ah {
            display: none;
        }
    }
    -->
    </style>

  </head>
  <body>

    <p class="ah">あーあーあー</p>
    <p>ただいまマイクのテスト中</p>
    
  </body>
</html>

 

参考