CSS -Grenzkurzanmeldung

Die Kurzeigenschaften von CSS neigen dazu, mehrere Eigenschaften gleichzeitig auszuführen. Mit der CSS -Rand -Shorthand -Eigenschaft können Sie die Breite, den Stil und die Farbe des Randes insgesamt ändern. Dieser Artikel zeigt eine Demonstration über die Arbeit von Border Shorthand -Eigentum. Darüber hinaus werden verschiedene Beispiele veranschaulicht, um das Eigentum der Grenze zu einer Kurzform zu erhalten.

Wie Grenze -Kurzform Eigentum funktioniert

Die CSS -Grenz -Kurzform funktioniert basierend auf der folgenden Syntax:

In der obigen Syntax,

• Die Wähler Kann jedes Element sein oder es kann sich auf die Klasse in CSS beziehen
• Die Breite bezieht sich auf die Breite der Grenze und kann in PX, EM, % festgelegt werden. Der PX legt den Standard fest und EM zeigt das Ergebnis, das sich auf den PX -Wert bezieht. Wenn der Körper beispielsweise einen PX -Wert gleich 4px hat, wäre er gleich 1EM, ähnlich, für 8px wäre er 2EM.
• Die Stil repräsentiert den Stil des Randes und kann gepunktet, gestrichelt, fest, doppelt, strich, nut, versteckt, eingelegt, gründen, keine.
• Die Farbe Eigenschaft fügt den Grenzen Farbe hinzu und die Farbe kann mit dem genauen Namen (rot, blau) unter Verwendung des Hexadezimalwerts der Farbe unter Verwendung des RGB/RGBA -Musterschemas bereitgestellt werden.

Die obige Diskussion muss Ihnen dabei geholfen haben, das Konzept des CSS -Grenzkontaldotentums zu erhalten.

So verwenden Sie CSS -Grenzkonthand -Eigentum

Die grundlegende Arbeit des Eigentums der Grenzekurse ist im obigen Abschnitt bereitgestellt. Hier werden wir nur wenige Beispiele ausüben, die die Verwendung des CSS -Grenzbesitzes demonstrieren.

Beispiel 1

Der folgende Code wird praktiziert, der die CSS -Grenz -Kurzform anwendet.

Die Beschreibung des Codes ist unten bereitgestellt:

• Zwei CSS -Klassen werden mit dem Namen "One" und "Two" erstellt
• Die "Eins" -Klasse verwendet eine Rand -Shorthand -Eigenschaft mit einer Breite von 2px, der Stil ist gestrichelt und die Farbe dunkelblau
• Die "zwei" Klassen praktiziert die Rand -Kurzformelemie mit den folgenden Werten: Breite ist 2px, der Stil ist gepunktet und die Randfarbe ist rot
• Die anderen Eigenschaften in der Klasse „Eins“ und „zwei“ beziehen sich auf die im Körper verwendeten Divs des Divs.
• Im Körper werden zwei Div -Tags verwendet, das erste Div -Tag verwendet eine "Ein" -Klasse von CSS und das zweite Div -Tag verwendet eine "zwei" -Klasse von CSS.

Das Bild des Code ist unten angegeben

Die Ausgabe des obigen Codes ist unten bereitgestellt:

Beispiel 2

Die Rand -Shorthand -Eigenschaft akzeptiert drei Parameter, und ihre Verwendung ist im obigen Beispiel bereitgestellt. Hier betrachten wir nur den „Stil mit Farbe“ und „Stil mit Breite“ der Border Shorthand -Eigenschaft mit dem folgenden Code.

Willkommen bei LinuxHint

Willkommen bei LinuxHint

Die Beschreibung des Codes ist unten bereitgestellt:

• Zwei CSS -Klassen werden mit dem Namen "Prim" und "Sec" erstellt
• Die „Prim“ -Klasse enthält den Stil und die Farbe der Border Shorthand -Eigenschaft
• Die „SEC“ -Klasse verwendet die Breite und den Stil
• Im Körper werden zwei Absätze erstellt, die jeder CSS -Klasse zugeordnet sind

Das Bild des Codes ist unten dargestellt:

Die Ausgabe des obigen Codes ist unten angezeigt:

Aus den oben dargestellten Beispielen hätten Sie in verschiedenen Szenarien die Funktionalität von Border Shorthand -Eigentum gelernt.

Abschluss

Die CSS-Grenzkonthandbesitz besteht aus drei Grenzeigenschaften, Grenzbreit-, Grenzstil- und Grenzfarbe. Dieser Artikel enthält einen detaillierten Leitfaden zum CSS Border Shorthand -Eigentum. Die Arbeit von Border Shorthand -Eigentum wird kurz erläutert, wo Sie ein grundlegendes Verständnis dieser Immobilie erhalten würden. Darüber hinaus werden in verschiedenen Szenarien mehrere Beispiele angegeben, in denen die CSS -Kurzeigeneignisse implementiert werden.