Heim >Web-Frontend >CSS-Tutorial >Warum verwendet CSS2.1 einen anderen „Überlauf' als „sichtbar', um Blockformatierungskontexte zu erstellen?
Warum schreibt CSS2.1 andere Überlaufwerte als „sichtbar“ vor, um einen neuen Blockformatierungskontext einzurichten?
In CSS2.1 Andere Überlaufwerte als „sichtbar“ werden angegeben, um einen neuen „Blockformatierungskontext“ zu erstellen. Diese Entscheidung hat Fragen zum Grundgedanken hinter der Kombination zweier scheinbar unabhängiger Funktionen aufgeworfen: der Erstellung eines Blockformatierungskontexts (BFC) und der Unterdrückung von Überläufen.
Historischer Kontext und wichtige Überlegungen
Anfragen auf der CSS-Mailingliste zufolge ergibt sich diese Entscheidung aus der Notwendigkeit, das Scrollen innerhalb von Boxen zu berücksichtigen, die sich mit Floats überschneiden. Die ursprüngliche CSS 2.0-Spezifikation erforderte, dass Browser beim Scrollen Inhalte um eindringende Floats herum neu umschließen mussten, was zu Leistungsproblemen führte.
Die CSS2.1-Änderung verhindert dieses Umbrechen, indem sie einen neuen BFC für andere Überlaufwerte als „sichtbar“ einrichtet. Dadurch wird sichergestellt, dass:
Beispiel
Bedenken Sie Folgendes Beispiel:
<div>...</div> <div> ...: ...: </div>
div { height: 80px; } div:first-child:before { float: left; height: 100px; margin: 10px; content: 'Float'; }
In CSS 2.0 überlappt das zweite Feld mit overflow: sichtbar (Standard) das schwebende Element. Mit overflow: auto (CSS 2.1) erhält die zweite Box jedoch einen neuen BFC, wodurch verhindert wird, dass der Float seinen Inhalt überschneidet.
Auswirkungen von Overflow: Hidden
Obwohl Overflow: Hidden normalerweise überlaufenden Inhalt verbirgt, ermöglicht es dennoch programmatisches Scrollen. Dies ist wichtig, da Boxen mit overflow:hidden, die sich überschneidende Floats enthalten, ebenfalls einen neuen BFC einrichten müssen, um ein Umbrechen beim Scrollen zu verhindern.
Änderungen in CSS2.1 eingeführt
CSS2 .1 führt zusätzliche Änderungen ein:
Konsistenz und Leistung
Letztendlich die Entscheidung, einen neuen BFC für den Überlauf zu erstellen Andere Werte als „sichtbar“ wurden in erster Linie durch Leistungsüberlegungen und den Wunsch nach Konsistenz beim Umgang mit überfüllten Inhalten bestimmt. Dieser Ansatz optimiert die Scrollleistung und sorgt für ein vorhersehbares Layout.
Das obige ist der detaillierte Inhalt vonWarum verwendet CSS2.1 einen anderen „Überlauf' als „sichtbar', um Blockformatierungskontexte zu erstellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!