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.

Yorumlar

Bu blogdaki popüler yayınlar

Linklerin Renklerini Değiştirme Örnek

HTML Element Referansları

HTML main Etiketi

HTML yorum etiketi ile öğe gizleme örneği

Html dersleri

javascript açıklama satırı

HTML5 Canvas Oyun Yapımı Dersleri

Uyurken Bile Para Kazanmak İster misin

CSS content Özelliği