<display-internal>
Einige Layout-Modelle, wie table
und ruby
, haben eine komplexe interne Struktur mit mehreren verschiedenen Rollen, die ihre Kinder und Nachkommen ausfüllen können. Diese Seite definiert jene "internen" Display-Werte, die nur innerhalb dieses speziellen Layout-Modus eine Bedeutung haben.
Syntax
Gültige <display-internal>
Werte:
table-row-group
-
Diese Elemente verhalten sich wie
<tbody>
HTML-Elemente. table-header-group
-
Diese Elemente verhalten sich wie
<thead>
HTML-Elemente. -
Diese Elemente verhalten sich wie
<tfoot>
HTML-Elemente. table-row
-
Diese Elemente verhalten sich wie
<tr>
HTML-Elemente. table-cell
-
Diese Elemente verhalten sich wie
<td>
HTML-Elemente. table-column-group
-
Diese Elemente verhalten sich wie
<colgroup>
HTML-Elemente. table-column
-
Diese Elemente verhalten sich wie
<col>
HTML-Elemente. -
Diese Elemente verhalten sich wie
<caption>
HTML-Elemente. ruby-base
-
Diese Elemente verhalten sich wie
<rb>
HTML-Elemente. ruby-text
-
Diese Elemente verhalten sich wie
<rt>
HTML-Elemente. ruby-base-container
-
Diese Elemente werden als anonyme Boxen generiert.
ruby-text-container
-
Diese Elemente verhalten sich wie
<rtc>
HTML-Elemente.
Formale Syntax
Beispiele
CSS-Tabellenbeispiel
Das folgende Beispiel zeigt, wie ein einfaches Formular mithilfe des CSS-Tabellenlayouts gestaltet wird.
HTML
<main>
<div>
<label for="name">Name</label>
<input type="text" id="name" name="name" />
</div>
<div>
<label for="age">Age</label>
<input type="text" id="age" name="age" />
</div>
</main>
CSS
main {
display: table;
}
div {
display: table-row;
}
label,
input {
display: table-cell;
margin: 5px;
}
Ergebnis
Spezifikationen
No specification found
No specification data found for css.properties.display.table-row-group,css.properties.display.table-header-group,css.properties.display.table-footer-group,css.properties.display.table-row,css.properties.display.table-cell,css.properties.display.table-column-group,css.properties.display.table-column,css.properties.display.table-caption,css.properties.display.ruby-base,css.properties.display.ruby-text,css.properties.display.ruby-base-container,css.properties.display.ruby-text-container
.
Check for problems with this page or contribute a missing spec_url
to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.
Browser-Kompatibilität
css.properties.display.table-row-group
BCD tables only load in the browser
css.properties.display.table-header-group
BCD tables only load in the browser
css.properties.display.table-footer-group
BCD tables only load in the browser
css.properties.display.table-row
BCD tables only load in the browser
css.properties.display.table-cell
BCD tables only load in the browser
css.properties.display.table-column-group
BCD tables only load in the browser
css.properties.display.table-column
BCD tables only load in the browser
css.properties.display.table-caption
BCD tables only load in the browser
css.properties.display.ruby-base
BCD tables only load in the browser
css.properties.display.ruby-text
BCD tables only load in the browser
css.properties.display.ruby-base-container
BCD tables only load in the browser
css.properties.display.ruby-text-container
BCD tables only load in the browser