Heim > Artikel > Web-Frontend > So legen Sie den Abstand in CSS fest
So legen Sie den Abstand in CSS fest
- 醉折花枝作酒筹Original
- 2021-04-21 17:27:515991Durchsuche
In CSS können Sie das Padding-Attribut verwenden, um den Abstand festzulegen. Sie müssen nur „Auffüllung: Wert + Einheit | Prozentwert“ für das Element festlegen. Die padding-Eigenschaft legt die Breite aller Polsterungen an einem Element oder die Breite der Polsterungen auf jeder Seite fest. Das Padding-Attribut erlaubt keine Angabe negativer Padding-Werte.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
Schauen wir uns an, wie man die Polsterung (Padding) einstellt:
Unsere Polsterung ist eines der CSS-Box-Modelle, also schauen wir uns nun an, wie man die Polsterung einstellt.
padding: Es handelt sich um ein Kurzattribut, das alle Füllattribute in einer Deklaration festlegen kann.
Verwenden Sie nur das Polsterungsattribut, um die obere, untere, linke und rechte Polsterung zu ändern.
Mögliche Werte:
Länge: Definieren Sie einen festen Abstand (Pixel, pt, em usw.)
%: Definieren Sie einen Abstand mit einem Prozentwert
Verwendung:
padding-left Legen Sie den Abstand des fest Objekt zum linken Randabstand
div{padding-left:5px}Der linke Abstand innerhalb des Objekts beträgt 5px
padding-right Stellen Sie den Randabstand von der rechten Seite des Objekts ein
div{padding-right:5px}Der rechte Abstand innerhalb des Objekts beträgt 5px
padding-top-Einstellung Der Füllabstand am oberen Rand des Objekts beträgt 5px
div{padding-top:5px}Der Füllabstand am oberen Rand des Objekts beträgt 5px
padding-bottom Legen Sie den Füllabstand am unteren Rand des Objekts fest
div{padding-bottom:5px}Der Abstand am unteren Rand des Objekts beträgt 5 Pixel.
Wenn alle vier Parameterwerte angegeben sind, werden sie in der Reihenfolge oben-rechts-unten-links auf die vier Seiten angewendet. Wenn nur einer vorhanden ist, wird dieser für alle vier Seiten verwendet.
Wenn zwei vorhanden sind, ist das erste für Auf-Ab und das zweite für Links-Rechts.
Wenn drei vorhanden sind, ist die erste für oben, die zweite für links-rechts und die dritte für unten.
Um dieses Attribut für ein Inline-Objekt zu verwenden, müssen Sie zunächst das Höhen- oder Breitenattribut des Objekts festlegen oder das Positionsattribut auf „absolut“ setzen.
Der Wert der Polsterung darf nicht negativ sein.
Beispiel:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
.css{
width:350px;
height:80px;
border:1px solid #00F;
padding-left:40px;
padding-right:40px;
padding-top:40px;
padding-bottom:40px;
/* 可以合起来写成padding:40px; */
}
</style>
</head>
<body>
<div class="css">padding用法</div>
</body>
</html>Rendering:
Empfohlenes Lernen:CSS-Video-Tutorial
Das obige ist der detaillierte Inhalt vonSo legen Sie den Abstand in CSS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!