Acest blog va discuta despre:

• Ce este Raza Conturului?
• Cum se aplică efectul de rază de contur pe elementul HTML?

Care este raza conturului?

„ contur ” este folosită pentru a modela conturul elementului, dar nu poate fi implementată direct. Prin urmare, metoda alternativă de a aplica efectul de rază asupra unui contur este utilizarea unui „ hotar-raza ” Proprietate CSS. Specifică colțurile rotunjite pentru contururi.

Cum se aplică efectul de rază de contur pe elementul HTML?

Pentru a utiliza proprietatea razei conturului, parcurgeți instrucțiunile date.

Pasul 1: încorporați titluri

Inițial, încorporați titlurile utilizând orice etichetă de titlu din „

' la '

”. De exemplu, am folosit „

' și '

” etichete pentru încorporarea a două titluri diferite într-un document HTML.

Pasul 2: Adăugați primul container div

După aceea, adăugați un recipient folosind „

' etichetă. De asemenea, introduceți „ clasă ” și specificați numele clasei în funcție de alegerea dvs.

---

---

Pasul 3: Creați al doilea container div

Creați un alt „ div ” recipient urmând aceeași procedură:

< h1 stil = „culoare:rgb(48, 10, 218)” > Linuxhint LTD Marea Britanie < / h1 >

< h2 >

Diferite exemple de chenar-rază pentru a crea colțurile unui contur circular.

< / h2 >

< div clasă = 'box1-div' >

Linuxhint oferă utilizatorilor săi cel mai bun și mai unic conținut.

< / div >

< div clasă = 'box2-div' >

Funcționează pe mai multe categorii.

< / div >

Rezultatul codului de mai sus este prezentat mai jos:

Pasul 4: Setați conturul primului container

Accesați primul container utilizând „ .box1-div ” clasa în care ” . ” este un selector pentru a accesa clasa:

.box1-div {

contur : solid ;

lăţime : 300px ;

căptușeală : 15px ;

marginea : 25px ;

}

Apoi, aplicați proprietățile CSS enumerate mai jos:

• „ contur ” proprietatea este utilizată pentru a adăuga un contur în jurul elementului. De exemplu, valoarea sa este setată ca „ solid ”.
• „ lăţime ” specifică dimensiunea elementului pe orizontală.
• „ căptușeală ” este utilizat pentru alocarea spațiului în jurul conținutului elementului.
• „ marginea ” specificați spațiul din partea exterioară a chenarului elementului.

Pasul 5: Setați conturul celui de-al doilea container

Acum, accesați al doilea element cu ajutorul clasei respective „ .box2-div ”:

.box2-div {

contur : solid ;

hotar-raza : 20px ;

lăţime : 300px ;

căptușeală : 15px ;

marginea : 25px ;

}

Aplicați proprietatea CSS „ hotar-raza ” pentru definirea razei elementului. Această proprietate vă permite să adăugați colțuri rotunjite în jurul elementului:

Se poate observa că am adăugat cu succes efectul de rază a conturului asupra elementului HTML.

Concluzie

„ contur-rază ' nu mai este disponibil. Utilizatorii pot aplica proprietățile razei conturului cu ajutorul proprietăților CSS „contur” și „raza-chenar”. „ contur ” adaugă un contur în jurul elementului, iar „ hotar-raza ” este folosit în mod special pentru stilizarea conturului. Această postare a demonstrat instrucțiunile pentru adăugarea efectului de rază a conturului în jurul elementului în HTML.