定義と使用法
表示プロパティセットまたは要素の表示タイプを返します。
HTML内の要素はほとんどあり"inline"または"block"の要素：インライン要素は、その左側と右側にコンテンツを浮動しています。 ブロック要素は、行全体を満たし、何もその左側または右側に表示することはできません。
表示プロパティは、著者が要素を表示または非表示にすることができます。 これは、に似ている可視性プロパティ。 隠された要素の内容が見えなくなることを意味するが、要素が元の位置と大きさにとどまる：しかし、あなたはディスプレイを設定していない場合：視認性がながらどれも、それは、全体の要素が非表示になります。
Tip:要素はブロック要素である場合は、その表示タイプは、float型のプロパティで変更することができます。
ブラウザのサポート
表示プロパティは、すべての主要なブラウザでサポートされています。
構文
表示プロパティを返します：
object .style.display
表示プロパティを設定します。
object .style.display= プロパティ値 値 説明 block 要素は、ブロックレベル要素としてレンダリングされ compact 要素は、ブロックレベルまたはインライン要素としてレンダリングされます。 文脈に依存します flex 要素は、ブロックレベルフレックスボックスとしてレンダリングされます。 CSS3の新 inherit displayプロパティの値は、親要素から継承されます inline 要素は、インライン要素としてレンダリングされます。 これがデフォルトです inline-block 要素は、インラインボックス内のブロックボックスとしてレンダリングされ inline-flex 要素は、インラインレベルフレックスボックスとしてレンダリングされます。 CSS3の新 inline-table 要素は、テーブルの前または後ない改行と、（<TABLE>のように）インラインテーブルとしてレンダリングされます list-item 要素がリストとして表示されます marker この値は、マーカーであることが箱の前または後に内容を設定する（：前と：で使用される。擬似要素の後にそうでない場合、この値は「インライン」と同一です） none 要素は表示されません run-in 要素は、ブロックレベルまたはインライン要素としてレンダリングされます。 文脈に依存します table 要素は、テーブルの前後に改行と、（<TABLE>のような）ブロックテーブルとしてレンダリングされ table-caption 要素は、（<キャプション>のような）テーブルキャプションとしてレンダリングされます table-cell 要素は、（同様に表のセルとして表示され<td>と<TH>） table-column 要素は、セルの列として表示されている(like <col>) table-column-group 要素は、1つまたは複数の列のグループとして表示される(like <colgroup>) table-footer-group 要素は、テーブルフッタ行として表示される(like <tfoot>) table-header-group 要素は、テーブルヘッダー行としてレンダリングされている(like <thead>) table-row 要素は、（<TR>のような）テーブルの行として表示されます table-row-group 要素は、1つ以上の行のグループとして表示される(like <tbody>) initial このプロパティがデフォルト値に設定します。 最初の記事を読みます inherit その親要素からこのプロパティを継承します。 継承についての記事を読みます
技術的な詳細
デフォルト値： 列をなして 戻り値： 要素の表示タイプを表す文字列、 CSSのバージョン CSS1
その他の例
例
表示特性と可視性との間の差：
function demoDisplay() {
document.getElementById("myP1").style.display = "none";
}
function demoVisibility() {
document.getElementById("myP2").style.visibility = "hidden";
} »それを自分で試してみてください
例
差"inline" 、 "block"と"none" ：
function myFunction(x) {
var whichSelected = x.selectedIndex;
var
sel = x.options[whichSelected].text;
var elem = document.getElementById("mySpan");
elem.style.display = sel;
} »それを自分で試してみてください
関連ページ
CSSチュートリアル： CSS表示と可視性
CSSリファレンス： display property
<スタイルオブジェクト