CSS-Syntaxhandbuch (3) Textfüllung, Rahmen, Grenz- und Positionseigenschaften (1)

1. Boxfüllattribute

1. Polsterung unten
Polsterung oben
Polsterung rechts

Funktion: Jeder Container hat einen Rand Diese Eigenschaften legen den Abstand zwischen dem Rahmen und den Elementen innerhalb der Box fest.

Wert:
Länge – Relativen oder absoluten Wert festlegen. Geben Sie die Maßeinheit nach der Zahl wie folgt an: mm, cm, in, pt, px, pc, ex, em. Die Einstellungen „em“ und „ex“ erzeugen Schriftgrößen relativ zur übergeordneten Schriftart.
Prozent – ​​Legt den Rand als Prozentsatz des übergeordneten Elements fest.
Hinweis: Für Füllwerte können keine negativen Werte verwendet werden, es können jedoch Dezimalzahlen verwendet werden.
Beispiel

2. Auffüllung

Funktion: Es handelt sich um ein Kurzattribut, das verwendet wird, um den Abstand zwischen dem Rahmen und Inhaltselementen oben, unten, links und rechts festzulegen.

Wert: Wie zuvor.
Erklärung: Verwenden Sie einen einzelnen Wert, um jede Kante im gleichen Abstand zu füllen. Wenn Sie zwei Werte verwenden, wird der erste Wert für die obere und untere Füllung verwendet, und der zweite Wert wird für die linke und rechte Füllung verwendet. Weisen Sie es der oberen Polsterung, der linken und rechten Polsterung und der unteren Polsterung zu. Wenn vier Werte verwendet werden, werden sie für die obere, rechte, untere und linke Polsterung verwendet. Numerische Typen können gemischt werden.
Beispiel

2. Boxrandattribute

1. border-top

border-bottom
border-right
border-left

Funktion: Diese vier Attribute sind allesamt Kurzattribute, die jeweils die oberen, unteren, rechten und linken Randattribute festlegen. Standardmäßig sind Rahmen nicht formatiert.

Wert: Es gibt drei Rahmenattribute
Rahmenbreite: Der Wert ist dünn, mittel, dick oder angegebene Länge.
Rahmenstil: Legen Sie die Schattierung fest, mit der der Rand dekoriert wird. Die folgenden Stile können eingestellt werden: keiner, gepunktet, gestrichelt, durchgehend, doppelt, Rille, Grat, Einschub, Anfang.
Rahmenfarbe: Legen Sie die Rahmenfarbe fest.
Beispiel

2. border-top-width

border-bottom-width
border-right=width
border-left-width

Funktion: bzw Legen Sie die Dicke jedes Randes fest.

Wert:
dünn – dünner Rand.
mittel – Mittlere Linienstärke.
dick – dicke Linie.
Länge – Legen Sie die Rahmenbreite in relativen oder absoluten Einheiten fest.
Beispiel

3. border-width

Funktion: Abkürzungsattribut, das die Breite von vier Rändern gleichzeitig festlegen kann.

Wert:
dünn – dünner Rand.
mittel – Mittlere Linienstärke.
dick – dicke Linie.
Länge – Legen Sie die Rahmenbreite in relativen oder absoluten Einheiten fest.
Beschreibung: Siehe Polsterbeschreibung.
Beispiel:

4. border-color

Funktion: Abkürzungsattribut, legt den Farbwert der vier Ränder fest.

Wert: Sie können Farbnamen oder RGB-Werte verwenden. Wenn eine einzelne Farbe angegeben wird, werden alle vier Ränder in dieser Farbe angezeigt; wenn zwei Farben angegeben werden, ist die Reihenfolge oben, unten, links und rechts; wenn drei Farben angegeben werden, ist die Reihenfolge oben, links, links und unten; wenn vier Farben angegeben sind, dann ist die Reihenfolge oben, rechts, unten, links.
Anleitung: Die Farbnamen lauten wie folgt
Aqua, Schwarz, Blau, Fuchsia, Grau, Grün, Limette, Kastanienbraun, Marineblau, Oliv, Lila, Rot, Silber, Blaugrün, Weiß, Gelb.
Für RGB-Werte: Es gibt drei Möglichkeiten,
#rrggbb; rgb(r,g%,b%) anzugeben
Beispiel:

5. Rahmenstil

Funktion: Wird zum Anzeigen von Rahmen und Festlegen von Rahmenstilen verwendet.

Wert:
keine – Der Rand wird nicht angezeigt. Dies ist der Standardwert. 3D-Einfügungslinie
Kamm – gratartige 3D-Linie
Einfügung – sorgt dafür, dass die Seite am Anfang sinkt - verleiht der Seite ein schwebendes Gefühl.
Hinweis: Nicht alle Browser können Grate, Einfügungen usw. anzeigen. Bei Stilen wie „Versatz“ zeichnen einige Browser alle Ränder als durchgezogene Linien.




6. Rand

Funktion: Abkürzungsattribut, alle Randattribute festlegen.

Wert:

Rahmenbreite – Wert dünn, mittel, dick oder angegebene Länge. border-style – Werte none, dotted, dashed, solid, double, Groove, Ridge, inset, outset

border-color – Verfügbare Farbnamen oder RGB-Werte.

Hinweis: Im Gegensatz zu anderen abgekürzten Attributen kann jede Einstellung nur einen Wert annehmen. Dieses Attribut wirkt sich gleichmäßig auf alle Seiten des Felds aus.

Beispiel:

Das Obige ist der Inhalt des CSS-Grammatikhandbuchs (3) Textfüllung, Rahmen, Rahmen- und Positionseigenschaften (1). Weitere verwandte Inhalte finden Sie unter: Bitte achten Sie auf die chinesische PHP-Website (www.php.cn)!