CSS ile border-radius (Yuvarlak Kenarlı Kutular) Oluşturmak
CSS ile yuvarlak kenarlı kutular (border-radius) nasıl oluşturulur ? CSS ile yuvarlak kenarlı kutular (border-radius) oluşturmanın püf noktalarını anlatmaya çalışacağız.
Yuvarlak köşeli alanlar oluşturmak son dönemlerde Web tasarımcılarının sıkça tercih ettiği yöntemlerden biridir. Daha şık durduğuna inanılmaktadır.
border-radius özelliği ise CSS3 ile birlikte gelmiş ve HTML elemanlarına yuvarlak veya oval kenar özelliği verme olanağı sağlıyor bizlere. Web 2.0 ve yeni biçimlerle birlikte bir çok web sitesinde artık yuvarlak kenarlı yapılar yer alıyor ve buda yuvarlak kenarları önemli duruma getiriyor.
CSS kodu;
-webkit-border-radius:10px;-moz-border-radius:10px; border-radius:10px;
Yapısı :
Tek değer atanmış ise, dört köşeyede aynı değer uygulanır.
İki değer atanmış ise, ilk değer sol üst ve sağ alt köşeye; ikinci değer sağ üst ve sol alt köşeye uygulanır.
Dört değer atanmış ise, sırası ile sol üst, sağ üst, sağ alt ve sol alt köşelere uygulanır.
Üç değer atanmış ise, ikinci değer sağ üst ve sol alt köşeye uygulanır.