Warum hat Bootstrap 3 „box-sizing: border-box' als Standard ausgewählt?

Warum hat Bootstrap 3 Box-Sizing eingeführt: Border-Box für alle Elemente?

Im Übergang von Bootstrap 2.3.2 zu 3.0 .0 war eine bemerkenswerte Änderung die Übernahme von border-box als Standard-Boxgröße für alle Elemente. Diese grundlegende Änderung erfordert eine Untersuchung, um zu verstehen, warum Bootstrap diese Entscheidung getroffen hat.

Aus den offiziellen Versionshinweisen geht hervor, dass die Änderung darauf abzielte, „das Rastersystem zu verbessern und die Größenoptionen zu vereinfachen“. Durch die Einbeziehung aller Elemente sorgt das Border-Box-Attribut für einfachere Größenberechnungen, insbesondere innerhalb des Rastersystems.

Das Bootstrap-Rastersystem ist völlig flüssig, wobei die Spalten als Prozentsätze der Gesamtbreite definiert sind. Die Dachrinnen behalten jedoch eine feste Pixelbreite mit 15 Pixel Auffüllung auf jeder Seite bei. Traditionell könnte diese Kombination aufgrund der unterschiedlichen verwendeten Einheiten zu komplexen Berechnungen führen.

Border-Box vereinfacht diesen Prozess jedoch, indem der Rahmen und die Auffüllung innerhalb der angegebenen Elementbreite einbezogen werden. Dadurch wird der vom Element eingenommene Bereich effektiv erweitert, was die Ausrichtung von Spalten und die Bestimmung des gesamten Rasterlayouts erleichtert.

Darüber hinaus entspricht die Einführung von Border-Box den Best Practices der Branche. Experten wie Paul Irish plädieren für eine weitverbreitete Einführung und verweisen auf die Vorteile hinsichtlich genauer Layoutkontrolle, Reaktionsfähigkeit und allgemeiner CSS-Wartbarkeit.

Das obige ist der detaillierte Inhalt vonWarum hat Bootstrap 3 „box-sizing: border-box' als Standard ausgewählt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!