Was bedeutet „flex: 1' in CSS Flexbox?

Die Flexbox-Eigenschaft verstehen: Was bedeutet „flex: 1“?

Die Flex-Eigenschaft, eine praktische Abkürzung für Flex-Grow, Flex-Shrink und Flex-Basis ermöglichen eine flexible Layoutsteuerung. Während der Standardwert „0 1 auto“ ist, kommt es in der Praxis häufig vor, dass „flex: 1“ auftritt.

Da stellt sich die Frage: Was bedeutet „flex: 1“ wirklich? Wird es als „1 1 auto“ oder „1 0 auto“ interpretiert?

Zur Verdeutlichung: „flex: 1“ stellt Folgendes dar:

• flex-grow: 1

  • Das zugehörige Div wird proportional zum Fenster erweitert Größe.

• flex-shrink: 1

  • Das Div schrumpft proportional zur Fenstergröße.

• flex-basis: 0

  • Die div Es fehlt ein expliziter Startwert und es belegt den Bildschirmplatz basierend auf dem verfügbaren Verhältnis.
  • Wenn beispielsweise drei Divs in einem Wrapper enthalten sind, beansprucht jedes etwa 33 % der Bildschirmbreite.

Das obige ist der detaillierte Inhalt vonWas bedeutet „flex: 1' in CSS Flexbox?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!