Was ist der Unterschied zwischen dem W3C-Boxmodell und dem IE-Boxmodell?

Schauen wir uns ihre Unterschiede anhand von Beispielen an:

(Empfohlenes Lernen: CSS-Schnellstart)

A The Das Box-Modell lautet wie folgt: Rand: 20 Pixel, Abstand: 10 Pixel; Breite: 200 Pixel; Höhe: 50 Pixel. Berechnen Sie nun die Breite und Höhe der Box unter den beiden Box-Modellen.

W3C-Standardbox:

Breite und Höhe des von der Box eingenommenen Platzes: (von der Browserseite eingenommener Platz)

Breite = 200 + 10* 2 + 10*2 + 20*2 = 280 px;

Höhe = 50 + 10*2 + 10*2 + 20*2 = 130 px;

Tatsächliche Breite und Höhe der Box:

Breite = 200 + 10*2 + 10*2 = 240 px;

Höhe = 50 + 10*2 + 10*2 = 90 px;

IE-Box:

Breite und Höhe des von der Box eingenommenen Platzes: (von der Browserseite eingenommener Platz)

Breite = 200 + 20*2 = 240 px;

Höhe = 50 + 20*2 = 90 px;

Tatsächliche Breite und Höhe der Box:

Breite = 200 px;

Höhe = 50 px;

Aus den Daten geht hervor, dass bei denselben Daten das Rahmenfeld kleiner ist als das Inhaltsfeld.

Anzeigeeffekt:

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