備忘録的プログラミングリファレンス

box-decoration-break プロパティ

 box-decoration-break プロパティは、エレメントの内容が<br>エレメントによって改行されている場合に、エレメントの表示を分割するかしないかを指定するプロパティです。
 box-decoration-break プロパティによる内容の分割は、paddingbordermarginbackgroundborder-imagebox-shadow、clip-pathプロパティによる表示が影響されます。

box-decoration-break プロパティ
-webkit-box-decoration-break: clone;
-o-box-decoration-break: clone;
box-decoration-break: clone;

詳しくは Example を参照してください

ページ内 Index

構文(Syntax)

CSS

box-decoration-break: slice | clone | initial | inherit ;

DOM ( JavaScript )

値の取得
String = object.style.boxDecorationBreak;
値の設定
object.style.boxDecorationBreak =" slice | clone | initial | inherit ";

Google Chrome では webkitBoxDecorationBreak であるようです。

値(Values)

Value摘要
slice初期値(default値)、エレメントの装飾ごと分割して表示
clone改行ごとにエレメントの装飾を表示
initial初期値に戻す
inherit親エレメントのプロパティを継承

備考(Remarks)

初期値(Default value)slice
継承(Inherited)no
変化(Animatable)no

Example

 box-decoration-break プロパティの例です。
 box-decoration-break プロパティによる内容の分割は、paddingbordermarginbackgroundborder-imagebox-shadow、clip-pathプロパティによる表示が影響されます。

 HTML テキストに JavaScript で box-decoration-break プロパティの値が取得できるかを確かめています。詳しくは開発用コンソールで参照してください。