Css yapısının temeline artılar sunan css3 ile yapacağımız bu kodlama resimlerimize ayrı bir hava katıyor gerçekten, kenarları oval olarak kesiyor resimleri çerçeve içerisine sığdırıyor. Özelikle ben bu özelliği çok sevdiğim için anasayfam da fazlasıyla kullanıyorum küçük resimlerin tamamı bu özelliği kullanarak oval hale getirildi.

  • Eski sürüm Tarayıcıların Dışında tüm tarayıcılar bu özellik görünmektedir.

Örnek

css-ile-Yuvarlak-kenarli-Resim-yapimi

  • Resimde  Gördüğün Resim 4px Olarak Çerçeve edilip ovalleştirilmiştir.

Kodlama

.ovalresim {
border: 1px solid #CCCCCC;
background-color: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

Kodların Kullanımı

<img class="ovalresim" src="resim-url" alt="açıklama" width="120" height="120" />
Metin Saraç 0 62 4 Nisan 2014
0 beğeni - 0 Yorum