6.604 kez okundu

Css ile divlerin köşelerini yuvarlama

10 10 6.604 kez okundu incelendi

Bu derste CSS3 ile gelen yeniliklerden biri olan köşe yuvarlatmayı anlatacağım arkadaşlar. Bunun için bir div oluşturuyoruz.

<div id="radus">###</div>

Css kodumuz da şu şekilde;

#radus {
background-color: #000;
height: 100px;
width: 100px;
}

Şu anda elimizde 100×100’lük siyah bir kare oluştu.

http://resim.sanalkurs.net/uploads/05_4.jpg

Köşeleri yuvarlaklaştırmak için css’e şu kodları ekliyoruz.

border: 1px solid #000;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;

Dikkat ettiyseniz yeni kodların yazımında tek tük değişiklikler var. Bu şekilde CSS’i düzenlediğimizde elimizde aşağıdaki gibi bir div oluşuyor.

http://resim.sanalkurs.net/uploads/1_466.jpg

Gelen aramalar :

Paylaş !

3 Yorum yapıldı “Css ile divlerin köşelerini yuvarlama”

  1. serbest web tasarımcı dedi ki:

    uzun zamandır bunu arıyorum .. Paylaşımınız için teşekkür ederim

  2. Nurdan dedi ki:

    Çok sağolun.

  3. ahmet dedi ki:

    iyi bir kod teşekurler

Yorum yap

Önceki yazıyı okuyun:
Css ile yazıların kenarlığını silme

Evet arkadaşlar bu derste basitçe border silmeyi göstereceğim. Mesela diyelim kullanıcı girişi bölümü yaptık. Temamıza da border uymuyor. Border'ı css...

Kapat
Barış Ozcan Facebook Sayfasi
Barış Ozcan Twitter