English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
flex-Die Initialbasiswert der Elastizitätselemente, die durch die basis CSS-Eigenschaft angegeben werden
Die folgende Tabelle enthält die Anwendungsbeschreibungen und Versionshistorie dieser Eigenschaft sowie ihre Verwendungssyntax im JavaScript-Skript.
| Standardwert: | auto |
|---|---|
| Geeignet für: | Flexible Artikel |
| Vererbung: | Nein |
| Animierbar: | Ja.Bitte beziehen Sie sich auf: Animationseigenschaften. |
| Version: | CSS3neue Funktion |
| JavaScript-Syntax: | object.style.flexBasis="180px" |
Die Syntax dieser Eigenschaft ist wie folgt:
flex-basis: width | auto | initial | inherit
Der folgende Beispiel zeigt, wie flex-basis-Eigenschaft.
.flex-container {
display: flex;
}
.item1 {
background: #ff80c0;
-webkit-flex-basis: 300px; /* Safari 6.1+ */
flex-basis: 300px;
}
.item2 {
background: #8080ff;
-webkit-flex-basis: 30%; /* Safari 6.1+ */
flex-basis: 30%;
}
.item3 {
width: 120px;
background:#0080ff;
}Testen Sie heraus‹/›Die folgende Tabelle beschreibt die Werte dieser Eigenschaft.
| Wert | Beschreibung |
|---|---|
| width | Länge in absoluten oder relativen Einheiten, die zur Festlegung der initialen Länge des flexiblen Elements verwendet wird. Negative Werte sind ungültig. |
| auto | Die Breite des flexiblen Elements ist gleich seinemwidthWert der Eigenschaft. Wenn width nicht für das flexible Element eine Eigenschaft festgelegt wird, hängt die Breite von seinem Inhalt ab. Dies ist der Standardwert. |
| initial | Setzen Sie diesen Wert auf seinen Standardwert. |
| inherit | Wenn angegeben, verwendet der verknüpfte Element seine flex-Eigenschaft des Elternelements.-Werte der Eigenschaft basis. |
flex-Die Kompatibilität der basis-Eigenschaft der Browser, die Nummern in der folgenden Tabelle stellen die niedrigste Versionsnummer der Browser dar, die diese Eigenschaft unterstützen; alle gängigen Browser unterstützen diese Eigenschaft.
|
Bitte beziehen Sie sich auf die folgenden Tutorials:CSS3Mehrspalten-Layout.
Verwandte Eigenschaften:align-content,align-items,align-self,display,flex,flex-direction,flex-flow,flex-grow,flex-shrink,flex-wrap,justify-content,min-height,min-width,order.