display
解説
要素が生成するボックスを規定します。
none | 指定要素とそこに含まれる子要素のボックスが生成されない |
---|---|
block | 指定要素がブロックレベル |
inline | 指定要素がインラインレベル |
list-item | 指定要素の内容をリストとして、内容が収められるボックスとリストのマーカーボックスを生成 |
marker | リストのマーカーボックスを生成(:before擬似要素、 :after擬似要素にのみ適用) |
compact | 前後の状況により、ブロックレベルかインラインレベル |
run-in | 前後の状況により、ブロックレベルかインラインレベル |
table | 指定要素を表関連要素(HTMLではTABLE)とする |
inline-table | 指定要素を表とするが、インラインボックスとする |
table-caption | 指定要素を表関連要素(HTMLではCAPTION)とする |
table-row | 指定要素を表関連要素(HTMLではTR)とする |
table-cell | 指定要素を表関連要素(HTMLではTH、TD)とする |
table-column | 指定要素を表関連要素(HTMLではCOL)とする |
table-row-group | 指定要素を表関連要素(HTMLではTBODY等)とする |
table-column-group | 指定要素を表関連要素(HTMLではCOLGROUP)とする |
table-header-group | 指定要素を表関連要素(HTMLではTHEAD)とする |
table-footer-group | 指定要素を表関連要素(HTMLではTFOOT)とする |
プロパティ情報
値: | none ,block ,inline ,list-item ,marker ,compact ,run-in ,table ,inline-table ,table-caption ,table-row ,table-cell ,table-column ,table-row-group ,table-column-group ,table-header-group ,table-footer-group のいずれか。 |
---|---|
初期値: | inline |
適用対象: | 全ての要素 |
継承: | しない |
パーセンテージ: | 不可 |
適用メディア: | 全て |
レベル: | 1〜2 |
参照
top bottom left right overflow overflow-x overflow-y position display float clear z-index visibility clip direction unicode-bidi writing-mode
使用例
ソース
CSSの記述方法はスタイルシートってなに?も参照下さい。 ul.sample1 li{ display : inline; background-color : #999999; }
HTMLの記述方法 <ul class="sample1"> <li>メニュー1</li> <li>メニュー2</li> <li>メニュー3</li> </ul>
表示結果
- メニュー1
- メニュー2
- メニュー3