Css de köşe yuvarlama

Mesajgönderen mehmet » Cum Ağu 20, 2010 4:58 pm


Öncelikle bu yöntemin internet explorer da çalışmadığını belirtelim. İnternet explorer maalesef çok yavaş gelişiyor ve web tasarım ile uğraşan insanları çoğu zaman çileden çıkarıyor. Yazılan bir kod genelde İnternet Explorer dışındaki tüm tarayıcılarda etkili olup Explorer da geçerli olamayabiliyor. Explorer için de ayrıca bir komut tanımlamak gerekiyor. Firefox ve chrome gibi tarayıcılarda köşe yuvarlamak için css tablo eklemeniz gerekecek. Daha sonra border-radius komutu ile bu tablonun köşelerini istediğiniz gibi yuvarlayabilirsiniz.
Kod: Tümünü seç

border
: 2px solid #8C8C8C;
border-radius:6px;
-
moz-border-radius: 6px;
-
khtml-border-radius: 6px;
-
webkit-border-radius: 6px;
width: 200px;
background-color: orange;
color: blue;
padding: 10px; 


Border-radius komutu köşelerin yuvarlanması için tanımalanan komut, diğer komutlar ise tarayıcılara özel komutlardır.

Bu kodu uyguladığımızda şöyle bir görüntü oluşacaktır:

Kodda yer alan padding içeriğin çerçeve kenarına olan uzaklığını ayarlar, color çerçeve içindeki metin rengini, background-color ise arkaplan rengini belirler.
Kullanıcı avatarı
mehmet
Mesaj Panosu Yöneticisi
Mesaj Panosu Yöneticisi
 
Mesajlar: 298
Kayıt: Pzt Şub 15, 2010 1:19 pm

Dön CSS

Kimler çevrimiçi

Bu forumu gezen kullanıcılar: Hiç bir kayıtlı kullanıcı yok ve 1 misafir