Wenn Sie Margin vs Polster in CSS verwenden, können Sie
Dieser Beitrag beschreibt:
- Wann soll "Polsterung" gegen "Rand" in CSS verwendet werden?
- So verwenden Sie "Rand" in CSS?
- So verwenden Sie "Polsterung" in CSS?
Wann soll "Polsterung" gegen "Rand" in CSS verwendet werden?
CSS “Rand" Und "PolsterungEigenschaften werden verwendet, um die Schnittstelle zu entwerfen. Sie werden auch verwendet, um die zusätzliche Lücke oder den Platz zwischen den Elementen anzugeben. Diese beiden Eigenschaften unterscheiden sich jedoch in Bezug auf die Funktionalität voneinander.
Hier erklären wir einige Unterschiede zwischen beiden Eigenschaften:
| Rand | Polsterung |
|---|---|
| Der Rand bietet Platz außerhalb des Elements. | Polsterung bietet Platz im Inhalt des Elements. |
| Wir können einen Elementrand als "festlegen"Auto”Um den Rand automatisch um das Element zu setzen. | Polsterung kann nicht als automatisch eingestellt werden. Der Benutzer muss die Werte angeben, um den Speicherplatz im Element festzulegen. |
| Der Rand hat den Stil eines Elements nicht beeinflusst. | Wenn wir Hintergrundfarbe auf das Element anwenden, wirkt sich dies auf das Styling eines Elements aus. |
| Wir können sowohl positive als auch negative Werte als Ränder einstellen. | Polsterung unterstützt nur positive Werte. |
So verwenden Sie "Rand" in CSS?
Um das zu nutzenRandErstellen Sie zuerst eine Eigenschaft "eine"Container und die Klasse zuweisen. Zum Beispiel haben wir die als sogenannte Klasse zugewiesen “zugewiesen“LinuxHint”. Dann etwas Text in einen Absatz -Tag einbetten “ LinuxHint ist eine der besten Tutorial -Websites Das Ergebnis des oben festgelegten Codes wird unten erwähnt: Jetzt erstellen Sie einen anderen “"Container mit der Klasse"Rand”Und wenden Sie die“ anStil”Attribut als“Grenze: 1px solide schwarz”. Fügen Sie danach einen Text in die “hinzu“ LinuxHint ist eine der besten Tutorial -Websites. Ausgang Wenden Sie nun die Eigenschaft „Margin“ auf “an“ an.Margin-Div ”-Klasse: Im obigen Code das “.Rand”Wird für den Zugriff auf das DIV-Element verwendet, um unterauflistete Eigenschaften anzuwenden: Hier können Sie sehen, dass wir die “erfolgreich eingestellt haben“Rand"Eigentum in der zweiten"div" Element: So verwenden Sie "Polsterung" in CSS? Um die Eigenschaft „Polsterung“ zu verwenden, wurden die oben genannten Beispiele verwendet. In dieser Sekunde "div"Container, benutze die Klasse"PolsterungUm Polsterung anzuwenden: LinuxHint ist eine der besten Tutorial -Websites LinuxHint ist eine der besten Tutorial -Websites. Ausgang Polsterung und andere CSS -Eigenschaften auf der “auf dem“.PolsterungKurs, schauen Sie sich den bereitgestellten Code an: In oben erwähnter Code haben wir auf die zweite zugegriffen. “div”Element Verwenden der Klasse“.Polsterung”. Wir haben die "Hintergrundfarbe" und "Schriftgröße" festgelegt. Darüber hinaus die “PolsterungDie Eigenschaft wird verwendet, um den Elementinhalt von jeder Seite als „Platz hinzufügen“ zu verleihen50px”. Ausgang Wir haben die Unterschiede und Verwendungen von „Polsterung“ und „Rand“ in CSS erklärt. Abschluss Das CSS “Rand”Wird verwendet, um den Abstand um das Element zu setzen, während das“Polsterung”Wird verwendet, um den Abstand um den Elementinhalt hinzuzufügen. Erstellen Sie zunächst eine „Margen- oder Padding -Eigenschaft an“, um zuerst eine zu erstellen “divContainer und geben Sie die Klasse an. Greifen Sie danach mit dem Unterrichtsnamen auf die Klasse zu und wenden Sie die “anRand" Und "Polsterung" Eigenschaften. Dieser Beitrag hat die Verwendung von Margin und Polster in CSS erläutert.
Hintergrundfarbe: RGB (199, 238, 205);
Schriftgröße: Medium;
Grenze: 3px RGB (114, 250, 114);
Rand: 100px 100px 100px 100px;
Hintergrundfarbe: RGB (199, 238, 205);
Schriftgröße: Medium;
Polsterung: 50px 50px 50px 50px;