Was ist der Unterschied zwischen Flex-Layout und traditionellem Layout?

Was ist der Unterschied zwischen Flex-Layout und traditionellem Layout?

Traditionelles Layout: basierend auf dem Box-Modell, basierend auf den Anzeigeattributen, Positionsattributen und Float-Attributen

Flex-Layout: Flex ist die Abkürzung für flexible Box und bedeutet „; elastisches Layout“, das für maximale Flexibilität bei Boxmodellen sorgt.

(Empfohlenes Tutorial: CSS-Schnellstart)

Das auf display:flex festgelegte Element wird als „Container“ bezeichnet, und seine untergeordneten Elemente werden als „Elemente“ bezeichnet. Es ist zu beachten, dass die Attribute „float“, „clear“ und „vertikal-align“ der untergeordneten Elemente ungültig sind, nachdem der Container auf Flex-Layout eingestellt wurde.

Warum müssen wir die Hauptachse und bestimmen? Seitenachse?

Die Hauptachse und die Seitenachse werden durch die Biegerichtung bestimmt (Standard ist Reihe). Der Grund, warum die Hauptachse bestimmt werden muss, besteht darin, die Ausrichtungsrichtung des Elements zu bestimmen:

Wenn die Flexrichtung Zeile oder Zeilenumkehr ist, dann ist die Hauptachse Blocksatzinhalt

Wenn die Flexrichtung „Spalte“ oder „Spaltenumkehr“ ist, dann ist die Hauptachse „Align-Items“.

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen Flex-Layout und traditionellem Layout?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!