Ovaj blog će raspravljati o:

• Što je radijus obrisa?
• Kako primijeniti učinak radijusa obrisa na HTML element?

Što je radijus obrisa?

' obris ” Svojstvo se koristi za oblikovanje obrisa elementa, ali se ne može izravno implementirati. Stoga je alternativna metoda primjene efekta radijusa na konturu korištenje ' granični radijus ” CSS svojstvo. Određuje zaobljene kutove za obrise.

Kako primijeniti učinak radijusa obrisa na HTML element?

Da biste koristili svojstvo radijusa obrisa, prođite kroz dane upute.

Korak 1: Ugradite naslove

U početku ugradite naslove koristeći bilo koju oznaku naslova iz '

” do “

”. Na primjer, koristili smo '

' i '

” oznake za ugrađivanje dvaju različitih naslova u HTML dokument.

Korak 2: Dodajte prvi div spremnik

Nakon toga dodajte spremnik pomoću '

” oznaka. Također, umetnite ' razreda ” atribut i odredite naziv za klasu prema vašem izboru.

---

---

Korak 3: Stvorite drugi div spremnik

Stvori još jednu ' div ” spremnika slijedeći isti postupak:

< h1 stil = 'boja:rgb(48, 10, 218)' > Linuxhint LTD UK < / h1 >

< h2 >

Različiti primjeri radijusa obruba za stvaranje kutova obrisa kružnice.

< / h2 >

< div razreda = 'box1-div' >

Linuxhint svojim korisnicima pruža najbolji i najunikatniji sadržaj.

< / div >

< div razreda = 'box2-div' >

Djeluje na više kategorija.

< / div >

Ishod gornjeg koda prikazan je u nastavku:

Korak 4: Postavite obrise prvog spremnika

Pristupite prvom spremniku koristeći ' .box1-div ' klasa gdje je ' . ” je selektor za pristup klasi:

.box1-div {

obris : čvrsta ;

širina : 300 px ;

podstava : 15 px ;

margina : 25 px ;

}

Zatim primijenite dolje navedena CSS svojstva:

• ' obris ” Svojstvo se koristi za dodavanje obrisa oko elementa. Na primjer, njegova vrijednost je postavljena kao ' čvrsta ”.
• “ širina ” određuje veličinu elementa vodoravno.
• “ podstava ” koristi se za dodjelu prostora oko sadržaja elementa.
• “ margina ” odredite razmak s vanjske strane ruba elementa.

Korak 5: Postavite obrise drugog spremnika

Sada pristupite drugom elementu uz pomoć njegove odgovarajuće klase ' .box2-div ”:

.box2-div {

obris : čvrsta ;

granični radijus : 20 px ;

širina : 300 px ;

podstava : 15 px ;

margina : 25 px ;

}

Primijeni CSS svojstvo ' granični radijus ” za definiranje polumjera elementa. Ovo svojstvo omogućuje dodavanje zaobljenih kutova oko elementa:

Može se primijetiti da smo uspješno dodali učinak radijusa obrisa na HTML element.

Zaključak

' obris-radijus ' više nije dostupan. Korisnici mogu primijeniti svojstva radijusa obrisa uz pomoć svojstava CSS 'outline' i 'border-radius'. ' obris ' dodaje obris oko elementa, a ' granični radijus ” posebno se koristi za oblikovanje obrisa. Ovaj post demonstrira upute za dodavanje efekta obrisa radijusa oko elementa u HTML-u.