Der Unterschied zwischen Polsterung und Rand in CSS

In CSS bezieht sich der Rand auf den Abstand vom eigenen Rand zum Rand eines anderen Containers, also den Abstand außerhalb des Containers. In CSS bezieht sich Padding auf den Abstand zwischen dem eigenen Rahmen und dem Rand eines anderen Containers in sich selbst, also dem Abstand innerhalb des Containers.

Im Folgenden wird die allgemeine Verwendung von Polsterung und Rand erläutert

1. Grammatikstruktur

(1) padding-left:10px; left padding (2) padding-right: 10px; right padding

(3) padding-top: 10px; Polsterung oben

(4) Polsterung unten: 10px; Polsterung unten

(5) Polsterung: 10px; einheitliche Polsterung auf allen vier Seiten

(6) Polsterung : 10px 20px; Polsterung oben, unten, links und rechts

(7) Polsterung: 10px 20px 30px; Polsterung oben, links und unten

(8) Polsterung: 10px 20px 30px 40px; , rechts, unten, links Polsterung

2. Mögliche Werte

(1) Länge gibt die Polsterung in bestimmten Einheiten an Länge (2 ) % Die Länge der Polsterung basierend auf der Breite des übergeordneten Elements

(3) auto Der Browser berechnet die Polsterung

(4) inherit legt fest, dass die Polsterung vom übergeordneten Element übernommen werden soll

3. Browser-Kompatibilitätsprobleme

(1) Alle Browser unterstützen das Auffüllattribut (2) Jede Version von IE unterstützt unterstützt den Attributwert „inherit“ nicht

2. margin

1. Syntaxstruktur

(1)margin- left:10px; left margin(2) margin-right:10px; right margin

(3) top External margin

margin-unten: 10px; unterer äußerer Rand

(5) Rand: 10px; einheitlicher äußerer Rand auf allen vier Seiten

(6) Rand: 10px 20px; Ränder

(7) Rand: 10px 20px 30px; Ränder oben, links, rechts, unten

(8) Rand: 10px 20px 30px 40px; Rand oben, rechts, unten, links

2. Mögliche Werte

(1) Länge gibt die Randlänge in bestimmten Einheiten an (2)% Die Länge des Randes basierend auf der Breite des übergeordneten Elements

(3) auto Der Browser berechnet den Rand

(4) inherit gibt an, dass der Rand vom übergeordneten Element geerbt werden soll

3. Browser-Kompatibilitätsprobleme

(1) Alle Browser unterstützen das Margin-Attribut (2) Keine Version von IE unterstützt den Attributwert „inherit“

3. Der Unterschied zwischen Rand und Polsterung wird durch ein Diagramm dargestellt:

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen Polsterung und Rand in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!