螺旋デザイン｜はじめてのCSS　印刷用CSS：色々な印刷CSSの手法について

はじめてのCSS：やさしさいっぱいのCSSが肌にしみこむ！カモ。

印刷用CSS：色々な印刷CSSの手法について

2009/01/19

トモ・リーン: 印刷対応には色々なタイプがあるわ。
そのバリエーションをサクッと説明します。

ケンジ: おう〜！

トモ・リーン: リストにしてみました。
難易度は下に行くほどupします。

ナビゲーション削除タイプ

ナビゲーションを削除してIE6でも表示が乱れないようにする。

図解：ナビゲーション削除タイプ

印刷用に全く違うレイアウトを作る

配置を変更してIE6でも全ての情報が見えるようにする。

図解：印刷用に全く違うレイアウトを作る

スクリーンと全く同じように印刷する

zoomプロパティを使用し、全体を縮小する。

図解：スクリーンと全く同じように印刷する

ケンジ: 上の２つ「ナビゲーション削除タイプ」「印刷用に全く違うレイアウトを作る」、劇的に見栄えが変わってるけどスクリーン用と印刷用に2ページ作る、って訳じゃないよね？

トモ・リーン: もちろん違うわ。
1つのHTMLで印刷用のCSSを指定することにより、見栄えを変更しているのよ。
別の印刷用のページが用意できたらそれはそれでいいけど、同じ内容で別のフォーマットというのは修正・更新を繰り返すたびに内容にズレが生じる危険性があるわね。

ケンジ: 最後のスクリーンと同じように見せるタイプの「zoomプロパティ」って今まで使ったこと無かったな。

トモ・リーン: IE専用のプロパティなのよ。

トモ・リーン: 次はタイプ別に実際に組んでみます。
お楽しみに〜！

今回のポイント！: いろんな方法でIE6でも印刷出来る方法がありますが、意外と「スクリーン」と同じように印刷するのは大変です。

次の記事を見る

前の記事を見る

トラックバック(0): このブログ記事を参照しているブログ一覧：印刷用CSS：色々な印刷CSSの手法について

このブログ記事に対するトラックバックURL: http://www.rasen-d.net/z/mt/mt-tb.cgi/119

コメントする

オススメ本: HTMLタグ+スタイルシート辞典ちび
基礎はもちろんCSSの記述に必要なことも載っているのでオススメ！; 現場のプロから学ぶXHTML+CSS
実際のXHTML+CSSの作業について学びたい方にオススメ！

オススメCSSのサイト: TAG index
ものすごく使いやすいHTML & CSSのリファレンスサイト; CSSフリーライブラリー
色々なテーマごとにCSSの情報が集まっています！

オススメ勉強会: CSS Nite
お気軽な無料の会（主にアップルストアで）から、本格的な有料セミナーまで楽しい勉強会を開催してくれます。; Re:Creator’s Kansai（リクリ）
関西のクリエイターの交流、勉強会・セミナーの開催を目的としたコミュニティです。

螺旋デザインメンバーも執筆に参加！: XHTML+CSS プロが教える“本当の使い方”
現場で培われたXHTML+CSSのテクニックを徹底解説!!

話題のiPhoneアプリ: 大藤幹のHYML/XHTML辞典
HTML5に対してもアップデート対応するらしいですよ！これで重い辞書とはおさらば♪; myPANTONE
色辞典です。サイトの色のイメージをクライアントと打ち合わせするときに、これを使ったらカッコ良すぎて話しがまとまりやすくなるかも！

Amazon.co.jp ウィジェット