//-->








ana sayfa



Online Kodlama Dersleri, CSS DERSLERİ, PHOTOSHOP DERSLERİ, HTML DERSLERİ, JAVASPRİT DERSLERİ, FLASH DERSLERİ

css de Resimsiz oval koseler

CSS 3 ile hiç resim kullanmadan düz köşeleri oval hale getirebileceğinizi biliyor muydunuz?

Baştan uyarayım arkadaşlar, css 3 kullanarak oval köşeler yaparsanız şu tarayıcılarda düzgün olarak gözükür:

- Mozilla Firefox
- Google Chrome
- Safari

Razıysanız derse geçelim. Öncelikle oval köşeler yapmak için iki ayrı kod kullanacağız çünkü firefox ile safari'nin algıladıkları kodlar farklı. ( Chrome ve Safari aynı CSS altyapısını kullandığı için, ikisinde bir kodla oval köşeler oluşturabiliyoruz. )

Firefox'ta oval köşeler için aşağıdaki kodu kullanıyoruz:






Bunlar px cinsinden değerler alırlar. ( Radius değeri px cinsinden olur çünkü ) Örnek:





Tabi isterseniz her köşe için tek tek değerler atayabilirsiniz. 4 köşe için ayrı ayrı kodu kullanmak isterseniz:



Yukarıdaki kodları çok az İngilizce biliyorsanız anlayabilirsiniz ama yinede Türkçe karşılıklarını verelim:

- top: üst
- bottom: alt
- left: sol
- right: sağ

Örneğin sadece üst köşeleri yuvarlatmak istiyorsanız:

-moz-border-radius-topleft: 10px;
-moz-border-radius-topright:10px;
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;


Bir dersimiz daha bitti. Hoşçakalın...






Arama


Google Grubumuz
Google Gruplar
onlinekodlama grubuna kayıt ol
E-posta:
Bu grubu ziyaret et

Öğrencilerin Forum Sitesi
Kolera Fan Sitesi
Forum & Oyunlar & Sözlük & MGaleri & Videolu Dersler
Kolera Fan Forumu & Kuvvet Mira Videoları
=> Sen de ücretsiz bir internet sitesi kurmak ister misin? O zaman burayı tıkla! <=