page-break-afterプロパティ

TOPページに戻る > CSS

スポンサード リンク

page-break-afterプロパティ

ページを印刷するときの改ページの位置が指定できます
指定したブロック要素の後で改行することができます
値がalways、auto以外の値は対応しているブラウザが少ないです
初期値はautoでブラウザが自動で改ページを決めます

使い方(書式)

セレクタ { page-break-after: 値; }                                    

page-break-afterプロパティ

対応ブラウザ ie6 ie7 ie8 ie9 ie10 ie11 google Chrome safari fire fox opera
適用できる要素 ブロック要素
子要素へのスタイルの継承 しない

プロパティの値 説明
auto ブラウザが自動で判断。初期値
always 指定したブロック要素の後で改行する
avoid 要素の後で改行されなくなる
left 要素の後でコンテンツが左ページにくるようにする。対応ブラウザがOperaのみ
right 要素の後でコンテンツが右ページにくるようにする。対応ブラウザがOperaのみ

実際の指定方法

.hoge { page-break-after: auto; }    /* ブラウザが自動で判断 */
.hoge2 { page-break-after: always; } /* ブロック要素の後で改行 */
.hoge3 { page-break-after: avoid; }  /* ブロック要素の後で改行されなくなる */
.hoge4 { page-break-after: left; }   /* 要素の後でコンテンツが左ページにくるようにする */
.hoge5 { page-break-after: right; }  /* 要素の後でコンテンツが右ページにくるようにする */

html部分

<div class="hoge2">
<p>2ページ目。印刷するときブロック要素の前で改行します</p>
</div>
<div class="hoge2">
<p>3ページ目。印刷するときブロック要素の前で改行します</p>
</div>



実際の表示

2ページ目。印刷するときブロック要素の前で改行します

3ページ目。印刷するときブロック要素の前で改行します



(C)2012 ホームページ作成無料