HTMLの画面上と印刷時のレイアウト

質問

WEB 上では、認識しやすい大き目のフォントサイズ、カラー（Css 指定）で表示をしているが、印刷コマンドを実行したときは、小さいフォントサイズ、モノトーン（Css 指定）で印刷される。

こんな事は可能でしょうか？

***

STYLE 指定タグ（ HEAD 内）に [ media=print ] の一文を書き添えると、印刷時はその Css を参照してくれます。（確認済み）

しかし、画面表示用の Css 属性が別項目に設定してあると [ media=print] の Css は無視されてしまいます。

[ media=tv, projection ] と言うのもあるようですが、有効ではないようです。

***

PS: このような事は、JavaScript でないと出来ないのでしょうか？

Css： カスケード・スタイル・シート
環境： Win98SE, IE 5.5

回答No.1

blackdog

（動作確認は、Windows IE 5.5でのみ）
基本的には、CSS 基本タグ内に [ media=print ] の一文を加えるだけで、
印刷時にはそちらの CSS を参照してくれるようです。

/* --- ここから --- */
<!-- 画面用 -->
<STYLE type="text/css"><!--
P { font-size: small; color: blue }
--></STYLE>
<!-- 印刷用 -->
<STYLE type="text/css" media="print"><!--
P { font-size: 9pt; font-family: "ＭＳ ゴシック"; color: black }
--></STYLE>
/* --- ここまで１セット --- */

/* --- ここから --- */
<!-- 画面用 -->
<link rel="stylesheet" href="Screen.css">
<!-- 印刷用 -->
<link rel="stylesheet" href="Print.css" media="print">
/* --- ここまで１セット --- */

印刷時に変更したいスタイルに対しては、否定（ none 等）も含めて
全てを記述した方がよろしいかと思います。

但し、印刷用の CSS を指定しても無視される場合があります。（下記参照）
現在、私が認識している無視される場合の例：
印刷時にスタイルを変更したい文字列などに対して
※　HTML スタイル（フォントサイズ、カラーなど）を適用している
※　その文字列などに、直接 CSS スタイルを適用している
その他にもあったような気がするのですが、実験を繰り返している間に
無視される場合の記述方法を忘れてしまいました。