CSS3 box-ordinal-groupEigenschaft
Beispiel
Die Anzeigereihenfolge der Kindelemente einer angegebenen Box:
.box
{
display:-ms-flexbox; /* Internet Explorer 10 */
display:-moz-box; /* Firefox */
display:-webkit-box; /* Safari und Chrome */
display:box;
border:1px solid black;
}
.ord1
{
margin:5px;
-ms-flex-order:1; /* Internet Explorer 10 */
-moz-box-ordinal-group:1; /* Firefox */
-webkit-box-ordinal-group:1; /* Safari und Chrome */
box-ordinal-group:1;
}
.ord2
{
margin:5px;
-ms-flex-order:2; /* Internet Explorer 10 */
-moz-box-ordinal-group:2; /* Firefox */
-webkit-box-ordinal-group:2; /* Safari und Chrome */
box-ordinal-group:2;
}
{
display:-ms-flexbox; /* Internet Explorer 10 */
display:-moz-box; /* Firefox */
display:-webkit-box; /* Safari und Chrome */
display:box;
border:1px solid black;
}
.ord1
{
margin:5px;
-ms-flex-order:1; /* Internet Explorer 10 */
-moz-box-ordinal-group:1; /* Firefox */
-webkit-box-ordinal-group:1; /* Safari und Chrome */
box-ordinal-group:1;
}
.ord2
{
margin:5px;
-ms-flex-order:2; /* Internet Explorer 10 */
-moz-box-ordinal-group:2; /* Firefox */
-webkit-box-ordinal-group:2; /* Safari und Chrome */
box-ordinal-group:2;
}
Selbst ausprobieren »
Browser-Unterstützung
Derzeit unterstützen Mainstream-Browser die Eigenschaft box-ordinal-group nicht.
Internet Explorer 10 unterstützt dies über die private Eigenschaft ms-flex-order.
Firefox unterstützt dies über die private Eigenschaft -moz-box-ordinal-group.
Safari und Chrome unterstützen dies über die private Eigenschaft -webkit-box-ordinal-group.
Hinweis:Internet Explorer 9 und frühere IE-Versionen unterstützen flexbox nicht.
Attributdefinition und Verwendungshinweise
Die Eigenschaft box-ordinal-group legt die Anzeigereihenfolge der Kindelemente einer Box fest.
Elemente mit einem niedrigeren Wert werden vor Elementen mit einem höheren Wert angezeigt.
Hinweis:Elemente mit demselben Gruppenwert werden in ihrer Quellreihenfolge angezeigt.
| Standardwert: | 1 |
|---|---|
| Vererbt: | nein |
| Version: | CSS3 |
| JavaScript-Syntax: | object.style.boxOrdinalGroup=2 |
Syntax
box-ordinal-group: Ganzzahl;
| Wert | Beschreibung |
|---|---|
| integer | Eine Ganzzahl, die die Anzeigereihenfolge der untergeordneten Elemente angibt. |