display
- ブラウザ
表示形式
display: 値;
要素の表示形式を指定するプロパティです。
このスタイルを設定すると、ブロックレベル要素をインラインで表示したり、インライン要素をブロックレベルで表示することができます。
display: inline;
| プロパティ名 | 値 | 説明 |
|---|---|---|
| display | inline | インラインで表示 （初期値） |
| block | ブロックレベルで表示 | |
| list-item | リスト項目として表示 | |
| run-in | インラインまたはブロックレベルで表示 （状況による） | |
| compact | インラインまたはブロックレベルで表示 （状況による） | |
| none | 表示しない （領域そのものを生成しない） |
- IE 7以下とFirefoxは、「run-in」と「compact」の指定に対応していません。IE 8、Safari、Chromeは、「run-in」には対応しているものの「compact」には対応していないようです。
- table関連の値は省略させていただきました。
run-in について
run-in が指定された要素は、後に続くブロックレベル要素内の最初の部分に、インラインで配置されることになります。
ただし、次の場合は run-in が指定された要素はブロックレベルで表示されます。
compact について
compact が指定された要素は、後に続くブロックレベル要素の左マージン内に、インラインで配置されることになります。
ただし、次の場合は compact が指定された要素はブロックレベルで表示されます。
h1 {
display: inline;
}
.menu a {
display: block;
}
