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
