So stellen Sie die Randbreite mit CSS ein

So stellen Sie die Randbreite mit CSS ein

In HTML sind Grenzen so konzipiert, dass sie Unterschiede zwischen zwei Abschnitten schaffen und ein Element stylen. Zu diesem Zweck die “GrenzeDas Eigentum von CSS wird verwendet. Mit dieser Eigenschaft können Sie die Breite, den Stil und die Farbe des Randes anpassen. Die Randbreite hängt von dem Element -Erscheinungsbild ab, in dem wir diese Eigenschaft anwenden.

In diesem Handbuch lernen wir, wie Sie die Breite des Randes anpassen können.

Lasst uns beginnen!

Was ist „Grenz“ -Sachgüter in CSS?

In HTML, um einen Rand um ein Element um das zu entwerfen, das “GrenzeEigenschaft wird verwendet. Grundsätzlich ist es ein Kurzeigeneignis von “Rahmenbreite","Grenzstil", Und "Randfarbe”. Es wird verwendet, um die Breite des Randes, den Stil des Randes und die Farbe des Randes festzulegen.

Syntax von Grenzeigenschaften lautet:

Grenze: Breite Stilfarbe


Hier ist die Beschreibung der angegebenen Werte:

    • Breite: Es wird verwendet, um die Breite des Randes anzupassen.
    • Stil: Es wird für das Styling der Grenze verwendet, wie z. B. einen soliden, Kamm oder Doppel.
    • Farbe: Es wird verwendet, um die Farbe des Randes zu ändern.

Der "GrenzeDie Eigenschaft wird im folgenden Beispiel implementiert.

Beispiel: Erstellen Sie Rand mit CSS

In diesem Beispiel werden wir einen Rand um einen HTML -Abschnitt erstellen und die Klasse zuweisenGrenze”Dazu. Innerhalb des Abschnitts fügen wir einen Absatz mit dem hinzu

Schild:


"Erfolg ist nicht endgültig; Misserfolg ist nicht tödlich:
Es ist der Mut, weiterzumachen, der zählt." - Winston s. Churchill



Danach werden wir zum CSS gehen und die Randlänge mit der “anpassenGrenze" Eigentum.

Hier werden wir verwenden “.Grenze”Zugriff auf die Klasse, die wir dem Abschnitt zugewiesen haben. Wir haben den Wert der Breite festgelegt “5px", Stil "solide", und Farbe "RGB (142, 26, 153)”. Schließlich wird die Hintergrundfarbe des Abschnitts als “angegeben“Reg (214, 159, 181)”:

.Grenze
Grenze: 5px fester RGB (142, 26, 153);
Hintergrundfarbe: RGB (214, 159, 181);


Wenn alles fertig ist, führen Sie die HTML -Datei aus, um die folgende Ausgabe anzuzeigen:


Notiz: Sie können die Breite auch nach Ihren Wünschen erhöhen oder verringern.

Beispiel 2: Passen Sie die Randbreite um ein Bild an

In diesem Beispiel werden wir die Randbreite um ein Bild anpassen. Dazu werden wir ein Bild mit dem Tag in der HTML -Datei hinzufügen:




Gehen Sie nun in die CSS -Datei und setzen Sie die Randbreite, den Stil, die Farbe wie “10px","Rille","RGB (255, 0, 0)", bzw:

img
Grenze: 10px Groove RGB (255, 0, 0);


Es gibt uns die folgende Ausgabe:


Notiz: Im "GrenzeEigenschaft, Sie müssen immer einen positiven Wert der Breite zuweisen.

Wir haben die Methode angeboten, um die Breite des Randes um jedes Element anzupassen.

Abschluss

In CSS, um den Rand um ein Element anzupassen, das “GrenzeImmobilien werden genutzt. Sie können die Breite der Grenze entsprechend dem erforderlichen Erscheinungsbild der Elemente erhöhen und verringern. In diesem Artikel haben wir erklärt, wie man die Randbreite mithilfe der “anpasstGrenzeEigentum und geben verschiedene Beispiele dafür an.