Css Dersleri – Css’nin Yapısı

CSS’in yapısı iki ana kısımdan oluşur. Seçiciler  ve Bildirim Bloğu . Bildirim Bloğuda iki ye ayrılır. Özellik ve Değerdir.

css_genel_yapi

Not XML de Seçiciler HTML elementleri dışında yeni oluşturulan elementlerde olabilir.

Tüm HTML elementleri potansiyel Seçicilerdir. Seçiciler ismini de buradan alır, HTML seçilen element anlamındadır. Bildirim bloğu süslü parantezle açılır ve kapanır. Bildirimler arasında ” ; ” noktalı virgül kullanılır. özellik ve değerler birbirinden ” : ” iki nokta üstüste ile ayrılır.

[css]
h1 {
font: medium Arial;
}
[/css]

şeklinde arada boşluk verilerekde bildirm yapılabilir. Burada ilki font’un boyutunu ikincisi ise font ismini gösterir. İleride bu konuya daha ayrıntılı gireceğiz. Ayrıca sadece font etiketine özel ” / ” kullanımı vardır örnek aşağıda:

[css]
h1 {
font: medium/120% Arial;
}
[/css]

Burada ” / ” Seçicinin font boyutunu ve satır yüksekliğini gösterir.(font_boyutu/satir_yuksekliği)

Gruplama

Yukarıda hep bir Seçici’yi sadece bir HTML elementine atamayı gördük, Birden fazla HTML elementine de atama yapabilirz, buna gruplama denir. Gruplama Seçicilerde yapıldığı gibi Bildirmlerde de yapılabilir.

[css]
p, h3 {
font-family: Arial;
}[/css]

Not CSS2 ile birlikte Evrensel Seçici(universal selector) Seçiciler arasına katılmıştır, ” * ” ile gösterilir. * {color: red;} tüm elementleri kırmızı yapar. Bir anlamda gruplama yapar.
Burada düküman içindeki paragraflarda(p) ve başlıklarda(h3) fontların Arial olacağını tek bildirim ile belirttik. Gruplama yapılan Seçicileri ayırmak için ” , ” virgül kullanılır. Sınırsız sayıda Seçici gruplanabilir. Gruplama tasarımcılara büyük kolaylıklar sağlar. Bildirim’lerimizi de gruplayabiliriz, bununla ilgili yukarıda örnekler mevcut. Bir veya daha fazla Seçiciye bir den fazla bildirim ekleye biliriz.

[css]
p, h3{
font-family: Arial;
font-size:2;
font-weight: bold;
}
[/css]

Seçiciler ikiye ayrılır. Sınıf Seçicisi ve Id Seçicisi. CSS ile işlenmemiş bir dökümanda başlangıçta bir plan yaparak hangi içeriğin Sınıf Seçicisi hangi Seçicicinin Id Seçicisi olacağını planlamalıyız.

dersimizin devamını bir sonraki dersimizden alabilirsiniz. Kolay gelsin..

Bilişim Sesi

Bilişim Sesi internet sitesini yönetir veya yönettiğini sanır.

Bir Cevap Yazın