Овај блог ће расправљати о:
Шта је радијус обриса?
„ нацрт ” својство се користи за обликовање обриса елемента, али се не може директно имплементирати. Стога, алтернативни метод за примену ефекта радијуса на контуру је коришћење „ граница-радијус ” ЦСС својство. Он одређује заобљене углове за обрисе.
Како применити ефекат радијуса обриса на ХТМЛ елемент?
Да бисте користили својство радијуса обриса, прођите кроз дата упутства.
Корак 1: Уградите наслове
У почетку, уградите наслове користећи било коју ознаку наслова из „ <х1> ' до ' <х6> ”. На пример, користили смо „ <х1> ' и ' <х2> ” ознаке за уграђивање два различита наслова у ХТМЛ документ.
Корак 2: Додајте први див контејнер
Након тога, додајте контејнер користећи „ <див> ” ознака. Такође убаците „ класа ” атрибут и одредите име за класу по вашем избору.
Корак 3: Креирајте други див контејнер
Направите још један „ див ” контејнер пратећи исту процедуру:
< х1 стил = 'цолор:ргб(48, 10, 218)' > Линукхинт ЛТД УК < / х1 >< х2 >
Различити примери радијуса границе за креирање углова кружног облика.
< / х2 >
< див класа = 'бок1-див' >
Линукхинт пружа најбољи и најјединственији садржај за своје кориснике.
< / див >
< див класа = 'бок2-див' >
Ради на више категорија.
< / див >
Излаз горњег кода је приказан у наставку:
Корак 4: Поставите обрис првог контејнера
Приступите првом контејнеру користећи „ .бок1-див ” разред где је “ . ” је селектор за приступ класи:
.бок1-див {нацрт : чврст ;
ширина : 300пк ;
паддинг : 15пк ;
маргина : 25пк ;
}
Затим примените доленаведена ЦСС својства:
- „ нацрт ” својство се користи за додавање обриса око елемента. На пример, његова вредност је постављена као „ чврст ”.
- “ ширина ” одређује величину елемента хоризонтално.
- “ паддинг ” се користи за додељивање простора око садржаја елемента.
- “ маргина ” наведите простор на спољној страни ивице елемента.
Корак 5: Поставите обрис другог контејнера
Сада приступите другом елементу уз помоћ одговарајуће класе “ .бок2-див ”:
.бок2-див {нацрт : чврст ;
граница-радијус : 20пк ;
ширина : 300пк ;
паддинг : 15пк ;
маргина : 25пк ;
}
Примените ЦСС својство “ граница-радијус ” за дефинисање полупречника елемента. Ово својство вам омогућава да додате заобљене углове око елемента:
Може се приметити да смо успешно додали ефекат радијуса обриса на ХТМЛ елемент.
Закључак
„ обрис-радијус ' више није доступан. Корисници могу применити својства радијуса обриса уз помоћ ЦСС својстава „оутлине“ и „бордер-радиус“. „ нацрт ” додаје обрис око елемента, а „ граница-радијус ” се посебно користи за стилизовање обриса. Овај пост је демонстрирао упутства за додавање ефекта радијуса обриса око елемента у ХТМЛ-у.