1. Heim
  2. CSS3 Box-flex-Eigenschaft

Das beste CSS3 Box-flex-Eigenschaft-Tutorial im Jahr 2024. In diesem Tutorial können Sie Beispiele,Browser-Unterstützung,Attributdefinitionen und Anweisungen,Grammatik, lernen

CSS3 Box-flex-Eigenschaft

Beispiele

Definieren Sie zwei flexible p Elemente. Wenn die Gesamtbreite des Mutterkasten 300 Pixel ist, # P1 wird eine Breite von 100 Pixel haben, # P2 eine Breite von 200 Pixel aufweisen:

#p1
{
-moz-box-flex:1.0; /* Firefox */
-webkit-box-flex:1.0; /* Safari and Chrome */
-ms-flex:1.0; /* Internet Explorer 10 */
box-flex:1.0;
border:1px solid red;
}

#p2
{
-moz-box-flex:2.0; /* Firefox */
-webkit-box-flex:2.0; /* Safari and Chrome */
-ms-flex:2.0; /* Internet Explorer 10 */
box-flex:2.0;
border:1px solid blue;
}

Versuchen »

Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Die aktuelle Mainstream-Browser unterstützt keine Box-flex-Eigenschaft.

Internet Explorer 10 Privateigentum durch die -ms-flex-Unterstützung.

Firefox von Privateigentum -moz-box-flex Unterstützung.

Safari und Chrome von Privateigentum -webkit-box-flex Unterstützung.

Hinweis: Internet Explorer 9 und früheren Versionen von IE nicht unterstützt flexible Box.

Attributdefinitionen und Anweisungen

Box-flex Attribut gibt Feld untergeordnetes Element flexible oder feste Größe ist.

Tipp: Mit derBox schrumpfen und wachsen, ob das Element ein flexibler Schrumpf ist oder wachsen. Immer, wenn es mehr Platz in der Box, dehnen sich die flexiblen Elemente den Raum zu füllen.

Standard: 0,0 (was anzeigt, dass das Element nicht flexibel ist)
Vererbung: keine
Version: CSS3
JavaScript-Syntax: Objekt .style.boxFlex = 2,0

Grammatik

Box-flex:Wert;

Wert Beschreibung
Wert Flexibilität Elemente. All Flex ist relativ

Hot Tutorials

Kontaktiere uns

CSS3 Box-flex-Eigenschaft
10/30