Webmaster  Forumu

Geri git   Webmaster Forumu > Genel Programlama > Progamlama Dilleri > HTML CSS DHTML

Cevapla
 
Seçenekler Stil
Alt 06-22-2008, 03:25 PM   #1
ChuckyFun
ĆĥūćĸŷFũń
 
ChuckyFun - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: May 2008
Bulunduğu yer: Trabzon
Yaş: 30
Mesajlar: 38
Tecrübe Puanı: 10
ChuckyFun is on a distinguished road
Standart CSS HAkkında [İp Uçları]


Yazıya Link Verme Özellikleri

CSS şu dört selektörü destekler:

A:link
A:visited
A:active
A:hover


A:Link - Bu sayfadaki bütün normal linkler için bir stil oluşturur.
A:visited - Bu sayfadaki ziyaret edilen linkler için bir stil belirler.
A:active - Bu sayfa üzerindeki aktif linkler için bir stil belirler. Bir linkin aktif olması demek, onun tıklanabilir olması demektir.
A:hover - Bu mouse üzerine geldiğinde olabilecek değişmeleri belirleyen bir stildir.


Kullanabileceğiniz CSS Özellikleri:

color (renk)
text-decoration (yazıya süs)
font-weight (yazı kalınlık inceliği)
font-style (yazı stili)
font-family (yazı gurubu)
font-size (yazı boyutu)
background-color (arkaplan rengi)


LİNK ÖRNEKLERİ:

Altıçizili ve Renkli Linkler

Haydi birkaç link efekti hazırlayalım. Bir linkin mouse üzerinde geldiğinde renginin değişmesi ve altının çizili olmasını istiyoruz. Bunun için aşağıdaki kodu kullanabilirsiniz.

A:link {text-decoration: bold; color: red;}
A:visited {text-decoration: none}
A:active {text-decoration: none}
A:hover {text-decoration: underline; color: black;}


Arkaplanı Renkli Linkler

Bazı web sitelerinde mouse'u üzerine getirince bir linkin arkaplan resminin değiştiğini görmüşsünüzdür. Bunun nasıl yapıldığını görelim:

A:link {background: #FFCCCC; text-decoration: none}
A:visited {background: #FFCCCC; text-decoration: none}
A:active {background: #FFCCCC; text-decoration: none}
A:hover {background: #FFFFFF; font-weight:bold; color: black;}


NOT: Netscape ve Firefox tarayıcılarının eski sürümlerinde çalışmayacaktır.

Linklerin boyutunu değiştirmek

Bir diğer efekt de, mouse üzerine geldiği zaman yazının boyutunun değişmesidir. Bunu yapmak için aşağıda yer alan kodu kullanabilirsiniz.

A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}
A:hover {font-size:20; font-weight:bold; color: red;}
ChuckyFun isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Alt 06-22-2008, 03:26 PM   #2
ChuckyFun
ĆĥūćĸŷFũń
 
ChuckyFun - ait Kullanıcı Resmi (Avatar)
 
Üyelik tarihi: May 2008
Bulunduğu yer: Trabzon
Yaş: 30
Mesajlar: 38
Tecrübe Puanı: 10
ChuckyFun is on a distinguished road
Standart


CSS Yazı Rengi

Bir web sayfasında yazının rengini değiştirmek isterseniz, yapmanız gereken çok kolaydır. Aşağıdaki kodu kullanmanız yeterlidir.

p {color: #CC0033;}


CSS Yazı Fontları

Yazı fontunu değiştirmek istediğiniz zaman CSS'nin "FONT FAMILY" özelliğini kullanmalısınız. Şu şekilde:

p {font-family: Georgia,Times New Roman,Times,serif; }


Birden çok font yazmanın anlamı şudur: Eğer web sitenizi ziyaret eden kişinin bilgisayarında birinci font yoksa ikinci font devreye girecektir. Dolayısı ile yazılarınızın karmaşık görünmesi diye bir durum ihtimali azalacaktır.

CSS Text Size

Font boyutunu değiştirmek için birkaç farklı yol vardır:

Points
Pixels
Keywords
Percent


CSS Points

Points, Microsoft Word'teki gibi yazı boyutunu değiştirmenize imkan verir.

p {font-size: 25pt; }


CSS Pixels

Bir pixel'in ne olduğunu açıklamak çok müşküldür. Ama, bir pixel TV ya da bilgisayar monitöründe gördüğünüz en küçük parçadır, dersek heralde biraz açıklayıcı olmuş olacaktır. Pixel olarak boyut değiştirmek için aşağıdaki kodu kullanabilirsiniz.

p {font-size: 25px; }


CSS Keywords

Keyword, yani anahtar sözcüklerle yazı boyutu değiştirmek de CSS ile mümkündür. Ancak tarayıcılar bazen bunları farklı yorumlayabilir. Çeşitleri şunlardır:

xx-small
x-small
small
medium
large
x-large
xx-large


Kullanımı ise şu şekildedir:

p {font-size: small; }


CSS yazı stillerinizi deneyerek kullanmanız, farklı tarayıcılarda test etmeniz çalışmanızın sıhhati açısından önemlidir.
ChuckyFun isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla
Cevapla


Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)
 
Seçenekler
Stil

Yetkileriniz
Konu Acma Yetkiniz Yok
Cevap Yazma Yetkiniz Yok
Eklenti Yükleme Yetkiniz Yok
Mesajınızı Değiştirme Yetkiniz Yok

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-Kodu Kapalı

Hizli Erisim


WEZ Format +3. Şuan Saat: 11:20 AM.


Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
webmaster