CSS border-radius-ozelligi

CSS border-radius

Css border-radius özelliğini kullanarak html elemanlarının kenar yuvarlaklıkları ,yarıçapları gibi özellikler belirlenebilir.

Örnek:

Bu örneğimizde bir div kutusuna ve bir article html elemanına farklı border-radius değeri vererek özelliğin etkisini öğrenmeye çalışacağız.

div { border: 5px solid pink; padding: 30px; background: yellow; width: 180px; border-radius: 20px; } article { border: 5px solid red; padding: 30px; background: yellow; width: 180px; border-radius: 90px; margin-top: 50px; }

CSS border-radius nedir nasıl kullanılır

CSS border-radius	CSS border-radius özellikleri
Varsayılan Değer:	0
Kalıtsallık:	yok
Animasyon Özelliği:	var
Versiyon:	CSS3
JavaScript border-radius:	object.style.borderRadius="25px"

CSS border-radius Tarayıcı Desteği

CSS Kodu:
border-radius	5.0 4.0 -webkit-	9.0	4.0 3.0 -moz-	5.0 3.1 -webkit-	10.5

CSS border-radius Değerleri

border-radius:1-4 length|% / 1-4 length|%|initial|inherit;

CSS border-radius özelliği değerleri

CSS border-radius değerleri	CSS border-radius değerleri tanımları	CSS örnek uygulamalar
length	Sayısal değer girilir.
%	Yüzde değeri verilerek kavis verme işlemi yapılır.
initial	Özelliğin varsayılan değerini alır.
inherit	Soybağından gelen değeri taşır.