Photoshop'ta grafik hazırlamakla uğraşmak yerine güncel web tarayıcıların desteğinden faydalanın. border-radius özelliği ile kenarları dilediğiniz piksel boyutunda yuvarlayın.
Direk img etiketi için:
img {
border-radius: 10px;
}
Resmi 10 piksel yuvarladık. Şimdi ise Opera ve Mozilla'nın eski sürümleri için destek kodlarını yazalım.
img {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
Üst sol ve sağ alt kısımları yuvarlayalım:
img {
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
}
İstediğiniz kenarı aşağıda ki kodlarla yuvarlayabilirsiniz.
Sol üst: border-top-left-radius
Sol alt: border-bottom-left-radius
Sağ üst: border-top-right-radius
Sağ alt: border-bottom-right-radius
İnternet Explorer 8 ve öncesi için destek yoktur.
