Lucky bag::blog: 印刷用 CSS で背景画像を印刷させるサンプル
Sample！ この文書は、Lucky bag::blog の 「印刷用 CSS で背景画像を印刷させる方法」のサンプルです。印刷用 CSS を用意し、その中で h1#head に対して下記の指定をすることで、背景画像も印刷時に出力されるようにしています。 h1#head { color: #fff; display: list-item; list-style-image: url(head_bg.png); list-style-position: inside; letter-spacing: -1000em; font-size: 1pt; } 印刷プレビューで確認すると、指定している背景画像が表示されている。
印刷用スタイルシート（print.css）について | サイブリッジラボブログ
印刷用CSSを作成することで下記の様なことができます 印刷時に不必要だと思われるところを消す 文字サイズを大きくし、読みやすくする 文字間隔を適度に開けておいて、読みやすくしておく。 headの中に media=”print” を記述 まずはheadの中に下記を記述します。 <link rel=”stylesheet” href=”print.css” type=”text/css” media=”print” /> media=”print”とは media属性を加えることで、ページを見る環境によってスタイルシート を切り替えることが可能です。 media=”all”【全ての環境で適用】 media=”print”【印刷するときに適用】 print.cssを作成 print.css作成し、下記を最低限指定しておきましょう 例 #globalNavigation＝ナビゲーション #side
印刷対応 その2
こんにちは、木田です。 今回は前回の記事でご紹介した「印刷対応」について実際に対応方法についてご紹介したいと思います。 実装方法 ■グローバルナビなどのメイン部分以外が印刷出来なくてOKな場合 ざっくりと、印刷出来なくてもOKな部分を、 display:none; します。 例えば： （cssサンプル） /* 印刷に不要な要素を消す */ #headerNavi, #globalNavi, #subNavi, #leftNavi { display:none; } メイン部分以外の、印刷が不要な要素をdisplay:none;しています。 あとは微調整です。 ■display:none しないで対応したい！場合 各ブラウザの印刷対応について、対応していきます。 避けては通れません。 IE系 ・ページの横幅が、プレビュー時の横幅よりも大きい場合に、はみ出た部分にfloatが掛かっていると、表
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
