So drücken Sie Abstände und Ränder in CSS aus

Abstand und Ränder sind Eigenschaften in CSS, die zur Steuerung des Leerraums um Elemente herum verwendet werden. Der innere Rand legt den Abstand zwischen dem Elementinhalt und dem Elementrand fest, der über das Attribut „padding“ festgelegt wird. Der äußere Rand legt den Abstand zwischen dem Elementrand und benachbarten Elementen fest, der über das Attribut „margin“ festgelegt wird.

Padding und Ränder in CSS

Padding und Ränder sind Eigenschaften in CSS, die zum Festlegen des Leerraums um ein Element verwendet werden. Sie spielen eine entscheidende Rolle bei der Definition des Layouts von Elementen und der Gestaltung der Benutzeroberfläche.

Padding

Padding bezieht sich auf den Abstand zwischen dem Inhalt des Elements und dem Rand des Elements. Es kann über das Attribut padding festgelegt werden und sein Wert kann ein einzelner Wert (der den gleichen Abstand für alle Ränder darstellt) oder vier Werte (der den oberen, rechten, unteren und linken Rand darstellt) sein Entfernungen). padding 属性来设置，其值可以是单个值（表示所有边距的相同距离）或四个值（分别表示上、右、下、左的边距距离）。

语法：

<code>padding: <top> <right> <bottom> <left>;</code>

示例：

<code>div {
  padding: 10px;
}</code>

此示例将为 div 元素设置 10 像素的内边距，即元素内容在各条边距上都与元素边框保持 10 像素的距离。

外边距

外边距是指元素边框与相邻元素（或视口）之间的空间。它可以通过 margin

Syntax:

<code>margin: <top> <right> <bottom> <left>;</code>

Beispiel:

<code>div {
  margin: 20px;
}</code>

In diesem Beispiel wird ein Abstand von 10 Pixeln für das div-Element festgelegt, d. h. der Inhalt des Elements ist an allen Rändern 10 Pixel vom Elementrand entfernt .

🎜Ränder🎜🎜🎜Ränder sind der Abstand zwischen dem Rand eines Elements und angrenzenden Elementen (oder Ansichtsfenstern). Es kann über das Attribut margin festgelegt werden und sein Wert folgt ähnlichen Regeln wie das Auffüllen. 🎜🎜🎜Syntax:🎜🎜rrreee🎜🎜Beispiel:🎜🎜rrreee🎜In diesem Beispiel wird ein 20-Pixel-Rand für das div-Element festgelegt, d. h. der Elementrand ist an jedem Rand 20 Pixel von benachbarten Elementen entfernt. 🎜

Das obige ist der detaillierte Inhalt vonSo drücken Sie Abstände und Ränder in CSS aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!