Heim > Web-Frontend > CSS-Tutorial > So berechnen Sie die Größe des CSS-Box-Modells

So berechnen Sie die Größe des CSS-Box-Modells

青灯夜游
Freigeben: 2020-12-17 11:13:42
Original
10230 Leute haben es durchsucht

Die Größe des Standard-Box-Modells beträgt: „Breite und Höhe des Inhalts + Größe der Polsterung auf beiden Seiten + Größe der Ränder auf beiden Seiten“, während die Größe des IE-Box-Modells direkt ist: „die Breite und Höhe des Inhalts“, die Box. Die eingestellten Breiten-/Höheneigenschaften sind die Gesamtgröße der Box selbst. Wenn Polsterungen oder Ränder vorhanden sind, wird dies durch Verkleinern des Inhaltsbereichs erreicht.

So berechnen Sie die Größe des CSS-Box-Modells

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3-Version. Diese Methode ist für alle Computermarken geeignet. 🔜

1. Klassifizierung von Boxmodellen

Boxmodelle werden in zwei Typen unterteilt: das Boxmodell (seltsames Boxmodell) und das Standard-W3C-Boxmodell. 2. Größenberechnung des Standardmodells und des IE-Modells

1. Größenberechnung des Standardkastens des Inhalts + zwei Die Größe des Seitenabstands + die Größe der Ränder auf beiden Seiten

Die Größe des Felds auf der Seite: die Breite und Höhe des Inhalts + der Abstand auf beiden Seiten + die Ränder auf beiden Seiten + die äußeren Ränder auf beiden Seiten

2. Berechnung der IE-Boxgröße

Die Größe der Box selbst: die Breite und Höhe des Inhalts

Die Größe der Box auf der Seite: die Breite und Höhe des Inhalt + die Ränder auf beiden Seiten

IE-Box legt die Breiten-/Höhenattribute direkt auf die Box selbst fest. Die Gesamtgröße, wenn mit Polsterung oder Rändern, wird durch Verkleinern des Inhaltsbereichs erreicht

Weitere Programmierkenntnisse finden Sie unter : Erste Schritte mit der Programmierung! !

Das obige ist der detaillierte Inhalt vonSo berechnen Sie die Größe des CSS-Box-Modells. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage