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

参照

使用例

ソース

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