Die Hauptunterschied zwischen Rand und Auffüllung ist das Margin hilft dabei, Platz um das Element außerhalb des Rahmens zu schaffen, während padding dabei hilft, Platz um das Element innerhalb des Rahmens zu schaffen.

Im Allgemeinen unterhält fast jede Unternehmensorganisation eine Website. Es hilft, den Kunden über die Produkte und Dienstleistungen der Organisation zu informieren. HTML, CSS und JavaScript sind die grundlegenden Sprachen, die für die Webprogrammierung verwendet werden. HTML hilft dabei, die Struktur der Webseiten aufzubauen, während JavaScript den Inhalt interaktiv macht. Außerdem steht CSS für Cascade Style Sheets (CSS) und hilft, die Webseiten mit Styling vorzeigbar zu machen. Insgesamt sind Margin und Padding zwei Eigenschaften, die in CSS verfügbar sind.

CSS, Rand, Auffüllung

Was ist Margin

Margin ist eine CSS-Eigenschaft, die verwendet wird, um Leerzeichen um die Elemente außerhalb des Rahmens zu erstellen. Der Programmierer kann den Rand für oben, rechts, unten und links einstellen. Mit anderen Worten, er kann diese Werte mit margin-top, margin-right, margin-bot und margin-left einstellen.

Die Werte können von folgenden Typen sein.

Erstens ermöglicht auto dem Browser, die Marge zu berechnen. Außerdem bezeichnet Länge einen Rand in px, pt oder cm, während % hilft, einen Rand in Prozent relativ zur Breite des enthaltenden Elements zu beschreiben. Inherit schließlich bedeutet, dass der Rand vom Elternelement erben muss.

Abbildung 1: CSS-Beispiele mit Rand

Oben sind ein paar Beispiele. Das erste Beispiel setzt den Rand von oben, rechts, unten und links entsprechend den definierten Werten. Das zweite Beispiel definiert die oberen, rechten, unteren und linken Ränder in einer Zeile. Es weist oben und unten einen Rand von 25px zu, während rechts und links des Absatzelements 50px liegen. Im letzten Beispiel werden alle Ränder auf 25px des Absatzelements festgelegt.

Was ist Polsterung?

Padding ist eine CSS-Eigenschaft, die dabei hilft, Platz um ein Element innerhalb des Rahmens zu schaffen. Programmierer kann die Polsterung für oben, rechts, unten und links einstellen. Mit anderen Worten, er kann diese Werte mit padding-top, padding-right, padding-bottom und padding-left setzen.

Die Werte können von folgenden Typen sein.

Die Länge beschreibt die Auffüllung in px, pt oder cm, während % die Auffüllung in Prozent relativ zur Breite des enthaltenden Elements bezeichnet. Inherit schließlich beschreibt, dass die Auffüllung vom Elternelement geerbt werden soll.

Abbildung 2: CSS-Beispiel mit Padding

Oben sind ein paar Beispiele. Das erste Beispiel setzt die Auffüllung von oben, rechts, unten und links entsprechend den definierten Werten. Das zweite Beispiel definiert die oberen, rechten, unteren und linken Paddings in einer Zeile. Es weist oben und unten einen Rand von 25px zu, während rechts und links des Absatzelements 50px liegen. Im letzten Beispiel werden alle Abstände auf 25px des Absatzelements festgelegt.

Unterschied zwischen Rand und Auffüllung

Definition

Margin ist eine CSS-Eigenschaft, die verwendet wird, um Platz um das Element außerhalb des definierten Rahmens zu schaffen, während Padding eine CSS-Eigenschaft ist, die verwendet wird, um Platz um das Element herum innerhalb des definierten Rahmens zu schaffen. Dies erklärt also den Hauptunterschied zwischen Margin und Padding.

Werte

Außerdem können die Werte für margin auto, length, % oder inherit sein, während die Werte für padding length, % oder inherit type sein können. Daher ist dies ein weiterer Unterschied zwischen Margin und Padding.

Abschluss

Kurz gesagt, Margin und Padding sind zwei Eigenschaften in CSS, die das Styling der Webseiten ermöglichen. Es ist nicht möglich, diesen Eigenschaften negative Werte zuzuweisen. Der Hauptunterschied zwischen Margin und Padding besteht darin, dass Margin dabei hilft, Platz um das Element außerhalb des Rahmens zu schaffen, während Padding dabei hilft, Platz um das Element innerhalb des Rahmens zu schaffen.

Referenz:

1. „CSS-Ränder“. CSS-Marge, hier verfügbar. 2. CSS-Padding, hier verfügbar.