対象メディアの指定例

「印刷プレビュー」で確認すると、プリント用のスタイルで表示されます。

全てを対象としたスタイル(all.css)


body {
margin: 20px;
padding: 0;
}

h1 {
padding: 3px;
font-size: 150%;
}

h2 {
margin: 2em 0 1em;
padding: 3px;
font-size: 120%;
}

pre {
padding: 10px;
font-size: 100%;
}

パソコンを対象としたスタイル(screen.css)


body {
background-color: #f9f9f9;
font-size: 80%;
color: #666666;
}

h1 {
background-color: #e0e0e0;
}

h2 {
background-color: #ebebeb;
}

pre {
background-color: #ffffff;
border: 1px #c0c0c0 solid;
}

プリンタを対象としたスタイル(print.css)


body {
background-color: #ffffff;
font-size: 120%;
color: #000000;
}

h1 {
border: 2px #000000 solid;
}

h2 {
border-bottom: 2px #000000 solid;
}

pre {
border: 1px #000000 solid;
}

p.back {
display: none;
}

前のページに戻る