CSS3 Box-Pack-Eigenschaft
Beispiele
Das Kind-Element des div beide Box-align und Box-Pack zentriert Eigenschaften mit:
div
{
width:350px;
height:100px;
border:1px solid black;
/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-pack:center;
-ms-flex-align:center;
/* Firefox */
display:-moz-box;
-moz-box-pack:center;
-moz-box-align:center;
/* Safari, Chrome, and Opera */
display:-webkit-box;
-webkit-box-pack:center;
-webkit-box-align:center;
/* W3C */
display:box;
box-pack:center;
box-align:center;
}
{
width:350px;
height:100px;
border:1px solid black;
/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-pack:center;
-ms-flex-align:center;
/* Firefox */
display:-moz-box;
-moz-box-pack:center;
-moz-box-align:center;
/* Safari, Chrome, and Opera */
display:-webkit-box;
-webkit-box-pack:center;
-webkit-box-align:center;
/* W3C */
display:box;
box-pack:center;
box-align:center;
}
Versuchen »
Browser-Unterstützung
Die aktuellen Mainstream-Browser nicht Box-Pack Attribut unterstützen.
Internet Explorer 10 der -ms-flex-Pack Eigenschaft Eigenschaft anstelle unterstützen.
Firefox von Privateigentum - MOZ-box-pack-Unterstützung.
Safari, Opera und Chrome durch das Privateigentum -webkit-box-pack-Unterstützung.
Hinweis: Internet Explorer 9 und früheren Versionen von IE nicht unterstützt flexible Box.
Attributdefinitionen und Anweisungen
Box-Pack Box-Attribut gibt, wenn ein untergeordnetes Element in der Box des Kindes Element gelegt wird, ist kleiner als die Box.
Dieses Attribut gibt die Querrahmen horizontal und vertikale Position des vertikalen Rahmens.
| Standard: | Start |
|---|---|
| Vererbung: | keine |
| Version: | CSS3 |
| JavaScript-Syntax: | Objekt .style.boxPack = "center" |
Grammatik
box-pack: start|end|center|justify;
| Wert | Erklärung |
|---|---|
| Start | Für die allgemeine Richtung der Boxen wird das erste Kind in der linken Rand der linken Seite (das letzte Kind-Element von all den zusätzlichen Raum nach stehend) platziert. Für die Reverse-Boxen, wird die rechte Kante des letzten Kind-Element auf der rechten Seite platziert (alle zusätzlichen Raum vor dem ersten Kind Element platziert wird) |
| Ende | Für die normale Richtung Boxen, platziert das letzte Kind-Element des rechten Rand nach rechts (alle erste Kind mehr Platz vor). Für die Reverse-Boxen, das erste Kind von der linken Kante auf der linken Seite (das letzte Kind-Element von all den zusätzlichen Raum nach stehend) |
| Zentrum | Der zusätzliche Platz gleichmäßig in zwei Hälften geteilt ist, wird die erste Hälfte erstes Kind, legen Sie die andere Hälfte des letzten Kind-Element platziert |
| rechtfertigen | Die durchschnittliche zusätzlichen Raum zu jedem Teilelement zugeordnet |