印刷時に読みやすくしよう
印刷した場合に多少なりとも読みやすくしようと思い立ち、昨日、以下を参考に少しだけ調整しました。
CSS: 印刷用スタイルシートのススメ
具体的にはサイドバーとコメントフォームを非表示にし、フォントサイズを 10pt 固定の明朝体にしたくらいです。
こんな感じにしました。
body {
font-size: small;
}
.s {
color: #669966;
font-size: x-small;
}
}
@media print {
body {
font-family: "細明朝体", "MS P明朝", serif;
font-size: 10pt;
}
.s {
color: #669966;
font-size: 8pt;
}
form {
display: none;
}
}
@media screen {
#left {
float: left;
width: 24%;
overflow: hidden;
}
#right {
float: right;
width: 24%;
overflow: hidden;
}
#center {
float: left;
width: 50%;
border-left: 1px solid #000066;
border-right: 1px solid #000066;
overflow: hidden;
}
}
@media print {
#left {
display: none;
}
#right {
display: none;
}
#center {
width: 100%;
overflow: hidden;
}
}
全体はこちらです。
もしよろしければ印刷プレビューでも見てやってください。そんなに奇麗にしたわけではないですが、screen 用スタイルそのままよりはマシかな^^;。なんだか IE の印刷プレビューだと表示直後は真っ白になるな…倍率変えると表示されるけど。実際に印刷して試さないとだめかな^^;。どうやらレンダリングが遅いだけみたいです。
なぜこれをしようと思い立ったかと言いますと、木村剛さんのこの辺を以前見た時から少しだけ引っかかっていたからです。
というのは、気に入ったトラックバックはプリントアウトしてじっくり読むようにしているんですが、なぜだか分からないんですが、ココログではないブログの場合、私のコンピューターでは、本文が印字されないことがあるのです。
いやぁ、最近影響されてきてます^^;;。以前から印刷して読みやすいとは思ってなかったですが、どれくらいの人が印刷するかなぁ、とも思ってたわけですが。私がどうかはともかく、木村さんの記事にトラックバックをよくしている皆さんは、木村さんに読んでいただくためにやってみては?^^; という意味も込めてトラックバックしておきます。
(追記)
結局上記からさらにいじくって、記事だけを出力するようにしました。CSS 全体の方でチェックしてみてください_o_。テンプレートをいじって印刷時に出したくない部分は div class="neverPrint" にする、など。ついでに月別アーカイブを記述順に並べるようにしました(※)。これで、月別アーカイブを印刷するとなかなかよさげな感じになりそうです。
記事単位の改ページも入れようと思ったんですが、widows/orphans が全然サポートされてないので、奇麗に切るのが難しいのでやめました。
※date-based-archive テンプレートの MTEntries 要素を <MTEntries sort_order="ascend"> のようにします。
…5月いっぱいでココログプロをやめる予定なのにやけに逃避を-_-。一月くらい伸ばしてもいいか…^^;。
TrackBack
TrackBack URL for this entry:
http://app.cocolog-nifty.com/t/trackback/568/588542
Listed below are links to weblogs that reference 印刷時に読みやすくしよう:
» philosophical : 印刷時に読みやすくしよう [此処録ANNEX:ココログTIPS]
philosophical : 印刷時に読みやすくしよう [Read More]
Tracked on 2004.07.25 at 11:27 AM

Comments