- 2009-10-25 (日) 21:03
- CSS | HTML・XHTML
先日作成した印刷用CSS
先日ほぼ社内用ですが印刷用CSSを作成したので備忘録までに。
簡単な用件は社内向けということで、
・対象ブラウザ→IE6、Firefox3.x
・対象ページ →簡単な計算式の結果画面
そんなところで、とりあえず印刷できればいいという感じでした。
なんで、即席ですが大体以下のようになりました。
/*print*/
@media print {
body {
background:#fff;
color:#000;
font-size:12pt;
zoom:87%;/*ie*/
}
不要な画像 {
display:none;
}
モノクロ以外の色がついているテキスト {
color:#000 !important;
}
table,
tr,
td {
border-collapse:collapse;
border-spacing:0;
border:1px solid #666;
}
}
もっといろいろと指定していますがざっくりとこんな感じです。
ポイントは、
・IE用にzoom指定
・不要な画像は非表示
・色はモノクロに
・リンクは非表示または、underlineを付けたりアドレスを出したり
ぐらいですかね。後は必要に応じて線を入れると見やすくなるときもあります。
注意すべきは、印刷用としてファイルを分けていないので、このやり方だとMac版IEでは認識してくれないみたいです。
あまり印刷用CSSを作成する場面はないので、頼まれるごとに戸惑いますが、印刷したときに自分の思い通りに印刷されるととても気持ちがいいです。
- Newer: 最近のマイブーム
- Older: Firefoxは今後どうなるのやら
Comments:0
Trackbacks:0
- Trackback URL for this entry
- http://design-tracks.com/study/css/%e5%85%88%e6%97%a5%e4%bd%9c%e6%88%90%e3%81%97%e3%81%9f%e5%8d%b0%e5%88%b7%e7%94%a8css/trackback/
- Listed below are links to weblogs that reference
- 先日作成した印刷用CSS from 新米デザイナーの日報|design tracks

