[新着] Webテンプレートを仮オープンしました
page-break-*** は、印刷時の改ページ部分を指定するプロパティです。
（*** の部分には、before または after が入ります）
page-break-before … 直前の改ページを制御
page-break-after … 直後の改ページを制御
hr {
page-break-after: always;
}
| page-break-before （直前） |
auto … （自動）デフォルト |
|---|---|
| always … （直前で改ページする） | |
| avoid … （直前の改ページを禁止する） | |
| page-break-after （直後） |
auto … （自動）デフォルト |
| always … （直後に改ページする） | |
| avoid … （直後の改ページを禁止する） |
【指定例】
見出しの直前で改ページしたり、水平線で区切って改ページする場合の例です。
h2 { page-break-before: always; } … 見出し（h2要素）の直前で改ページします
hr { page-break-after: always; } … 水平線（hr要素）の直後で改ページします
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
h2 {
page-break-before: always;
}
-->
</style>
</head>
<body>
<h1>印刷時の改ページテスト</h1>
<p>これは1ページ目です</p>
<p>（改ページ部分は印刷プレビューでも確認できます）</p>
<hr>
<h2>■中見出し</h2>
<h3>小見出し</h3>
<p>これは2ページ目です</p>
<hr>
<h2>■中見出し</h2>
<h3>小見出し</h3>
<p>これは3ページ目です</p>
<hr>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
