display(ディスプレイ)について

BOXの表示形式を設定するプロパティです。使う前にブロック要素とインライン要素の違いくらいは知っておきましょう。

■CSS記述

.sample1 li { display:inline; }

■XHTML記述

<ul class="sample1">

<li>サンプル</li>

<li>サンプル</li>

<li>サンプル</li>

</ul>

■CSS記述

.sample2 { display:none; }

■XHTML記述

<p>サンプル</p>

<p class="sample2">サンプル</p>

<p>サンプル</p>

サンプル

display(ディスプレイ)の設定方法

display: (値);

inline: 表示をインライン要素にする。
block: 表示をブロック要素にする。
list-item: 表示をリスト要素にする。
table-cell: 表示をセル要素にする。
none: 指定した要素はブラウザ上で表示されません。
同じように要素を非表示にするvisibilityがあります。
displayの非表示はタグのあったレイアウトスペースは全て消えますが、
visibilityの非表示はタグのあったレイアウトスペースは残ります。
レイアウト調整で使う場合は使い分ける必要があります。