Der Browser, der historisch vom Standard -CSS -Box -Modell in Bezug auf die Breite abgewichen ist .
Hier ist der Grund:
* Standardboxmodell: Im Standard -CSS -Box -Modell gibt die Eigenschaft "width`) die Breite des Inhaltsbereichs eines Elements an. Polster- und Randbreiten werden dann * oben * dieser Inhaltsbreite hinzugefügt, um die Gesamtbreite des Elements zu bestimmen.
* Internet Explorer's Quirks -Modus -Box -Modell (auch als "defektes Box -Modell" oder "IE -Box -Modell" bezeichnet): Im Quirks -Modus berechnete der Internet Explorer die Gesamtbreite eines Elements * einschließlich * Polsterung und Grenzen. Also, wenn Sie `width:100px einstellen; Polsterung:10px; Grenze:5px; `Im Mackenmodus wäre die * Gesamt * Breite des Elements 100px und der Inhaltsbereich würde reduziert, um die Polsterung und die Grenzen aufzunehmen. In einem standardkonformen Browser wäre die Gesamtbreite 100px (Inhalt) + 20px (Polsterung) + 10px (Grenze) =130px.
Mackenmodus
Der Quirks -Modus wurde in älteren Versionen von Internet Explorer (insbesondere dh 5.5 und älter, und IE6 ausgelöst, wenn dem Dokument ein ordnungsgemäßes DocType fehlte), um Webseiten zu rendern, da sie für ältere Browser ausgelegt waren. Dies geschah, um die Rückwärtskompatibilität aufrechtzuerhalten und ältere Websites am Aufbrechen zu verhindern.
Moderne Browser und Standardmodus
Moderne Versionen von Internet Explorer (dh 7 und später) sowie allen anderen großen Browsern (Chrome, Firefox, Safari, Edge), standardmäßig für Standards -Modus Wenn im HTML -Dokument ein ordnungsgemäßes DocType vorhanden ist. Im Standardmodus implementieren sie das Standard -CSS -Boxmodell korrekt.
CSS `Box-Disien`-Eigenschaft
Die CSS-Eigenschaft "Box-Größen" bietet eine Möglichkeit, das Box-Modellverhalten zu ändern. Wenn Sie "Box-Größen:Border-Box;" auf einem Element festlegen, wird es sich wie das alte IE-Quirks-Modus-Box-Modell verhalten. Dies wird häufig verwendet, um Layoutberechnungen zu vereinfachen und reaktionsschnelle Designs zu erleichtern.
Zusammenfassend:Während kein aktiv verwendetes moderner Browser das Standard -Box -Modell standardmäßig absichtlich bricht, ist es historisch wichtig zu verstehen, wie der Internet -Explorer es im Mackenmodus verwendete. Die Verwendung von "Box-Größe:Border-Box" ist eine Möglichkeit, das Verhalten "IE-Box-Modell" absichtlich auf eine kompatible Art und Weise zu erreichen.