CSS'te Blok Kenarlık Yuvarlama
Şimdi bir bloğun köşelerini nasıl yuvarlayacağımızı
öğreneceğiz. Bunun için piksel cinsinden değer alan
border-radius özelliği kullanılmalıdır.
Örneğin, 10px olarak bir yuvarlama belirlediğimizde bu ne anlama gelir? Bu, bu yuvarlamaya yerleştirilebilecek dairenin yarıçapıdır. Eğer matematikle aranız iyi değilse ve son cümleyi anlamadıysanız - unutun ve sadece göz kararı yuvarlama değerini ayarlayın. Belli bir tecrübeyle bunu yapmak sorun değildir (yuvarlakları ölçmek için bir ölçüm aleti yoktur, en azından ben böyle bir şey duymadım).
Hadi bir bloğun köşelerini 10px yuvarlama değeri vererek yuvarlayalım:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
Sayfayı bu örneğe göre tekrarlayın:
