普通は変更した部分だけを印刷用のスタイルシートファイルに追加指定します
普通、印刷用スタイルシートは、印刷用に変更した部分と、新たに追加した部分だけで作ります。私の場合の印刷用スタイルシートは次のようになっていました。
#content {max-width: 1500px; margin: 0; padding-left:20px;}
#menu {display: none;}
.np {display: none;}
一行目で横幅を広めにしておいて、印刷で横幅が自動的に調整(横幅は元々フレキシブル)されるようにします。また、左側に余白を広めに取ります。二行目でサイドバーの印刷をやめて、三行目で広告等を印刷しないようにします。印刷のプレビューをしてみてください。こんなに簡単な設定でもうまく印刷されるはずです。
メインのCSSファイルに印刷用のスタイルシートを追加記入する
スタイルシートファイルは印刷用を別にする必要があると今まで思っていましたが、印刷用に変更した部分と、新たに追加した部分だけを次のようにmedia=”all”で指定したメインのスタ イルシートファイルの最後に追加すれば良いことがわかりました。
この方法を見つけたのは、グーグルウェブマスターツールを見ていたら「Labs」の「サイトのパフォーマンス」に「ページの読み込み時間の短縮方法」で、CSSファイルをまとめなさいと書いてあったのがヒントになったからです。
この方法だとprint.cssファイルが不要で、CSSファイルがひとつで良いことになります。この為、ファイルの読み込みが速くなり、SEOにもユーザーにも良いし、とても簡単で管理が楽になります。
@media print {
#content {max-width:1500px;margin:0;padding-left:20px;}
#menu {display: none;}
.np {display: none;}
}
