displayNN 4 IE 4 CSS 1

継承 : なし

すべての要素とテキストノードを囲む非表示のボックスが、ブラウザによってどのように処理されるかを決定する多目的属性です。たとえば、周辺のコンテンツに関連して要素を表示する方法だけをとってみても、ブロックレベル項目とインライン項目とではその性質はかなり異なります。CSS 仕様には、こうしたボックスのタイプが数多く用意されています。ボックスが占めるスペースは、ボーダーや表示規則 (コンパクトスタイルが定義リスト項目を制御する方法など) といった事項によって異なる影響を受けるからです。ブラウザの組み込みスタイルシートはバリエーションごとに異なるボックスを指定することがないので、実際には、一部の表示タイプ間で違いが出ることはありません。たとえば、table 要素は、その display スタイル属性が block または table に設定されていても同じように表示されます。同時に、display スタイルを使用すると、ブロックテーブルをインラインテーブルとして表示するなど、要素のデフォルトの表示動作を上書きできます。

DHTML で最も頻繁に使用される display スタイル属性の機能は、要素とそのスペースの表示および非表示を切り替えるスクリプトを設定するというものでしょう。属性を none に設定すると要素は表示されなくなり、周辺すべてのコンテンツは要素が通常占める領域を埋めて広がります。これは要素が表示されていないときにそのスペースを確保しておく visibility 属性と異なります。ただし、デフォルトの表示モードで項目を再表示したいときは、一般的な表示タイプ (blockinline) のいずれかを指定するか、要素に関連付けられ、かつターゲットブラウザがサポートするより具体的なタイプ (li 要素の list-item など) を指定することができます。

 
CSS 構文
 
display: displayType
 

CSS 仕様では多くの表示タイプが指定されていますが、ブラウザのサポートはより限定されています。次の表に、サポートされているタイプを示します。

表示タイプWindows 版 IEMacintosh 版 IENNCSS
block5462
compactなしなしなし2
inline5462
inline-block5.5なしなしなし
inline-tableなし5なし2
list-item5562
markerなしなしなし2
none4462
run-inなし5なし2
tableなし562
table-captionなし5なし2
table-cellなし562
table-column-groupなし5なし2
table-footer-group5.5562
table-header-group5562
table-rowなし562
table-row-groupなし562
 
既定値

要素に依存します。

 
 
.hidden {display: none}
 
適用先

すべての要素。ただし、一部の表示タイプは特定の要素のみに適用されます。

 
オブジェクト参照
 
[window.]document.getElementById("elementID").style.display