Gli utenti possono migliorare il layout di documenti HTML e pagine Web utilizzando CSS. A tale scopo, vengono utilizzate molte proprietà CSS e "contorno" e "radius di confine" sono una di queste. Più specificamente, il "contorno"La proprietà viene utilizzata per disegnare il contorno e il"raggio di confine"È utilizzato per impostare gli angoli arrotondati dell'elemento delineato.

Questo blog discuterà:

• Cos'è il raggio del contorno?
• Come applicare l'effetto del raggio del contorno sull'elemento HTML?

Qual è il raggio del contorno?

IL "contorno"La proprietà viene utilizzata per modellare il profilo dell'elemento, ma non può essere implementata direttamente. Pertanto, il metodo alternativo per applicare l'effetto raggio su uno schema utilizza un "raggio di confine"Proprietà CSS. Specifica gli angoli arrotondati per i contorni.

Come applicare l'effetto del raggio del contorno sull'elemento HTML?

Per utilizzare la proprietà del raggio del contorno, passare attraverso le istruzioni fornite.

Passaggio 1: integrati incorporati

Inizialmente, incorporare le intestazioni utilizzando qualsiasi etichetta di intestazione da "

" A "

". Ad esempio, abbiamo utilizzato il "

" E "

Passaggio 2: aggiungi il primo contenitore di div

Successivamente, aggiungi un contenitore usando ""Tag. Inoltre, inserire il “classe"Attributo e specifica il nome per la classe in base alla tua scelta.

Passaggio 3: crea un secondo contenitore di div

Crea un altro "div"Container seguendo la stessa procedura:

Linuxhint Ltd UK

Esempi diversi per il raggio di confine per creare gli angoli di una circolare di contorno.

Linuxhint fornisce i contenuti migliori e più unici per i suoi utenti.


Funziona su più categorie.

L'output del codice sopra è mostrato di seguito:

Passaggio 4: impostare il contorno del primo contenitore

Accedi al primo contenitore utilizzando il ".Box1-Div"Classe in cui la"."È un selettore per accedere alla classe:

.Box1-div
contorno: solido;
larghezza: 300px;
imbottitura: 15px;
Margine: 25px;

Quindi, applica le proprietà CSS sotto quote:

• IL "contorno"La proprietà viene utilizzata per aggiungere uno schema attorno all'elemento. Ad esempio, il suo valore è impostato come "solido".
• "larghezza"Specifica la dimensione dell'elemento orizzontale.
• "imbottitura"È utilizzato per allocare lo spazio attorno al contenuto dell'elemento.
• "margine"Specificare lo spazio sul lato esterno del bordo dell'elemento.

Passaggio 5: impostare il contorno del secondo contenitore

Ora, accedi al secondo elemento con l'aiuto della rispettiva classe ".Box2-Div":

.box2-div
contorno: solido;
raggio di confine: 20px;
larghezza: 300px;
imbottitura: 15px;
Margine: 25px;

Applicare la proprietà CSS "raggio di confine"Per definire il raggio dell'elemento. Questa proprietà ti consente di aggiungere angoli arrotondati attorno all'elemento:

Si può notare che abbiamo aggiunto correttamente l'effetto del raggio di contorno sull'elemento HTML.

Conclusione

IL "RAVIO DI SCHEDE" non è più disponibile. Gli utenti possono applicare le proprietà del raggio del contorno con l'aiuto delle proprietà CSS "contorno" e "radius di confine". IL "contorno"Aggiunge uno schema attorno all'elemento e il"raggio di confine"È specificamente utilizzato per lo styling del contorno. Questo post ha dimostrato le istruzioni per l'aggiunta dell'effetto del raggio di contorno attorno all'elemento in HTML.