一つのCSSでWEB用と印刷用を使い分ける方法
CSSは印刷用に別途用意する場合が多いのですが、一つのファイルにまとめてhttpアクセスを少なくし高速化を目指す「CSS efficiency tip: use a single stylesheet file for multiple media」というエントリーのご紹介。
微妙な違いですが、少しでもチューニングしたい場合に使えるかもしれません。
詳しくは以下
CSS内に@media属性を追加する
一つのCSSでメディアタイプを指定するには@media属性を使用します。
すべてのメディアに指定する場合は@mediaの外側に記述します。
以下のようなサンプルで動作するようです。
body { color:#ffff00; background-color:#fff; } @media screen, projection { body { background-image:url(background.png); } } @media print { body { color:#000; } } @media handheld { body { color:#0f6517; } }
複数のファイルを保守しなくても良い分、作業の効率化にもつながるのではないでしょうか。
ただしMac IEで動作しないとの事なので、注意です。
興味のある方はぜひ使ってみてください!
最新情報をお届けします