Beispiel
Lassen Sie alle die flexiblen Elemente die gleiche Länge, regardles ihres Inhalts sein:
for (i = 0; i < y.length; i++) {
y[i].style.flex = "1";
}
Versuch es selber " Definition und Verwendung
Die Flex-Eigenschaft legt oder gibt die Länge des Elements, bezogen auf den Rest der flexibelen Elemente in demselben Behälter.
Die Flex-Eigenschaft ist eine Abkürzung für die flexGrow, flexShrink und die flexBasis Eigenschaften.
Note: Wenn das Element nicht ein flexibles Element ist, die Flex - Eigenschaft hat keine Auswirkung.
Browser-Unterstützung
Die Flex-Eigenschaft wird in allen gängigen Browsern unterstützt, mit Ausnahme von Safari.
Hinweis: Die Flex - Eigenschaft wird nicht unterstützt IE 9 oder früher, in IE 10 ist diese Eigenschaft mit dem Präfix MS unterstützt. IE11 und neuere Versionen unterstützen voll und ganz die Flex-Eigenschaft (Sie den ms-Präfix nicht brauchen).
Hinweis: Safari 6.1 und höher unterstützt eine Alternative, die WebkitFlex Eigenschaft.
Syntax
Bringen Sie die Flex-Eigenschaft:
object .style.flexStellen Sie die Flex-Eigenschaft:
object .style.flex=" Eigenschaftswerte Wert Beschreibung flex-grow Eine Zahl angibt, wie viel das Element wird mit dem Rest der flexiblen Elemente relativ wachsen flex-shrink Eine Zahl angibt, wie viel das Element an den Rest der flexiblen Elemente relativ schrumpfen flex-basis Die Länge des Artikels. Zulässige Werte: "auto" , "inherit" oder eine Zahl , gefolgt von "%" , "px" , "em" oder jeder anderen Längeneinheit auto Wie 1 1 auto. initial Wie 0 1 auto. Lesen Sie mehr über Anfang none Das gleiche wie 0 0 auto. inherit Erbt diese Eigenschaft von seinem übergeordneten Elemente. Lesen Sie mehr über erben
Technische Details
Standardwert: 0 1 auto Rückgabewert: Ein String, die die Flex Eigenschaft eines Elements CSS Version CSS3
Verwandte Seiten
CSS - Referenz: flex property - flex property
HTML - DOM - ART - Referenz: flexBasis property
HTML - DOM - ART - Referenz: flexDirection property
HTML - DOM - ART - Referenz: flexFlow property - flexFlow property
HTML - DOM - ART - Referenz: flexGrow property
HTML - DOM - ART - Referenz: flexShrink property
HTML - DOM - ART - Referenz: flexWrap property
<Style - Objekt