Benutzer können das Layout von HTML -Dokumenten und Webseiten mithilfe von CSS verbessern. Zu diesem Zweck werden viele CSS-Eigenschaften verwendet, und „Umriss“ und „Border-Radius“ sind einer von ihnen. Genauer gesagt das “Umriss„Eigenschaft wird verwendet, um den Umriss und die“ zu zeichnen, und die “Grenzradius”Wird verwendet, um die abgerundeten Ecken des umrissenen Elements festzulegen.

In diesem Blog wird erörtert:

• Was ist Umriss Radius?
• So wenden Sie den Umruft -Radius -Effekt auf das HTML -Element an?

Was ist der Umriss Radius?

Der "UmrissDie Eigenschaft wird verwendet, um den Umriss des Elements zu formen, aber sie kann jedoch nicht direkt implementiert werden. Daher verwendet die alternative Methode zur Anwendung des Radius -Effekts auf einen Umriss eine “Grenzradius”CSS -Eigenschaft. Es gibt die abgerundeten Ecken für Umrisse an.

So wenden Sie den Umruft -Radius -Effekt auf das HTML -Element an?

Um die Eigenschaft um den Umrahlungsradius zu verwenden, gehen Sie die angegebenen Anweisungen durch.

Schritt 1: Einbettenüberschriften einbetten

Einbetten Sie zunächst die Überschriften mit, indem Sie ein beliebiges Überschriften -Tag von “verwenden“

" Zu "

”. Zum Beispiel haben wir das verwendet

" Und "

Schritt 2: Fügen Sie den ersten Div -Behälter hinzu

Fügen Sie danach einen Container mit der "hinzu"" Schild. Setzen Sie auch die “ein“KlasseAttribut und geben Sie den Namen für die Klasse nach Ihrer Wahl an.

Schritt 3: Erstellen Sie den zweiten Div -Container

Ein anderes erstellen "divContainer durch Befolgen desselben Vorgangs:

LinuxHint Ltd UK

Verschiedene Beispiele für Grenzradius, um die Ecken eines Umrisskreislaufs zu erzeugen.

LinuxHint bietet den besten und einzigartigsten Inhalten für seine Benutzer.


Es funktioniert in mehreren Kategorien.

Die Ausgabe des obigen Codes ist unten angezeigt:

Schritt 4: Stellen Sie den Umriss des ersten Containers ein

Greifen Sie mit dem ersten Container auf den Container zu.Box1-div”Klasse, in der die“.”Ist ein Selektor für den Zugriff auf die Klasse:

.Box1-div
Umriss: solide;
Breite: 300px;
Polsterung: 15px;
Rand: 25px;

Wenden Sie dann die folgenden CSS-Eigenschaften an:

• Der "UmrissEigenschaft wird verwendet, um das Element um einen Umriss hinzuzufügen. Zum Beispiel wird sein Wert als "festgelegt"solide”.
• “BreiteGibt die Größe des Elements horizontal an.
• “Polsterung”Wird verwendet, um den Raum um den Inhalt des Elements zuzuweisen.
• “Rand”Geben Sie den Raum an der Außenseite des Elementrandes an.

Schritt 5: Stellen Sie den Umriss des zweiten Containers ein

Greifen Sie nun mit Hilfe seiner jeweiligen Klasse auf das zweite Element zu “.Box2-div”:

.Box2-div
Umriss: solide;
Border-Radius: 20px;
Breite: 300px;
Polsterung: 15px;
Rand: 25px;

Wenden Sie die CSS -Eigenschaft an “GrenzradiusZum Definieren des Radius des Elements. Mit dieser Eigenschaft können Sie abgerundete Ecken um das Element hinzufügen:

Es ist zu bemerken, dass wir den Umruft -Radius -Effekt auf das HTML -Element erfolgreich hinzugefügt haben.

Abschluss

Der "Umriss-Radius" ist nicht mehr verfügbar. Benutzer können die Eigenschaften der Gliederung Radius mithilfe von CSS-Umriss- und „Grenz-Radius“ -Formen anwenden. Der "Umriss”Fügt einen Umriss um das Element und die“ hinzu “Grenzradius”Wird speziell zum Styling des Umrisss verwendet. In diesem Beitrag wurde die Anweisungen zum Hinzufügen des Umrennradius -Effekts um das Element in HTML gezeigt.