Heim > Web-Frontend > CSS-Tutorial > So drücken Sie Abstände und Ränder in CSS aus

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

下次还敢
Freigeben: 2024-04-28 16:48:17
Original
1204 Leute haben es durchsucht

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.

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

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>
Nach dem Login kopieren

示例:

<code>div {
  padding: 10px;
}</code>
Nach dem Login kopieren

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

外边距

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

Syntax:

<code>margin: <top> <right> <bottom> <left>;</code>
Nach dem Login kopieren

Beispiel:

<code>div {
  margin: 20px;
}</code>
Nach dem Login kopieren
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!

Verwandte Etiketten:
css
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