CSS Nedir?

Standart bir söz vardır; "HTML bir bina ise CSS onun boyası, tasarımı, iç ve dış kaplamasıdır." Bir web sayfasının tasarımından sorumlu olan konudur. CSS kelimesinin tam açılımı "Cascading Style Sheets" şeklindedir. Türkçe anlamı ile "Basamaklı Stil Şablonu" anlamına gelmektedir. Basamaklı olmasının nedeni kodların yukarıdan aşağıya, sağdan sola doğru sıralı şekilde okunması sebebiyledir. CSS aslında mükemmeldir, zira renksiz, karanlık, siyah beyaza mâhkum olan yazılımı adeta renkli cıvıl cıvıl bir hâle getirir. Özellikle günümüz web sitelerinin kullanıcılarını cezbedebilmesi için CSS konusuna ciddi ve gerekli değerler yazılımcı arkadaşlar tarafından kesinlikle verilmelidir. Aksi hâlde web siteniz kullanıcıların beğenisine kavuşmaz ve kullanıcı kaybedebilirsiniz. Tabi bir sitenin kalitesini gösteren tek etken CSS değil lakin CSS çok büyük bir etken :) Kısaca en büyük o mu bilmem ama çok büyük, şaka şaka gözünüzde büyütmeyin, gerektiği kadar çalışıp çabalarsanız çok kısa sürede çözersiniz kendisini, haydin iyi günler. Bu yazı Yazılım Tarihi başlığının altında olduğu için CSS hakkında sadece ne işe yaradığını anlattım. Eğer CSS'in detaylarını görmek nasıl kullanıldığını öğrenmek istiyorsanız, CSS başlığına gidebilirsiniz.

CSS Kombine veya Kompleks Seçiciler

CSS konusuna hakim kişilerin işini kolaylaştıran müthiş yapılardır. Sürekli ID veya Class değeri kullanmak yerine (HTML içerisinde belirtmek yerine) CSS tarafında yapılan küçük müdahaleler ile istenilen elemente doğrudan erişim sağlayabilmektedir. Kendi içerisinde 5 farklı maddeden oluşmaktadır. Bunlar: Gruplandırma, Alt Öğe (Descendant), Doğrudan Alt Öğe (child), Bitişik Kardeş Tekil (Adjancent Sibling), Genel Kardeş Çoğul (General Sibling) şeklindedir.


1) Gruplandırma:

Aynı CSS özellikleri birden çok HTML elementine verilmek isteniyorsa "class", "id", "element" fark etmeksizin "," işareti ile gruplandırılabilir.

<span class='output'></span...

CSS Temel Seçiciler || CSS Basic Selectors

CSS içerisinde en çok kullanılan seçim (erişim) yöntemidir. Kendi içerisinde 4 farklı başlıktan oluşmaktadır. Bunlar. Class seçiciler, ID seçiciler, Universel * seçici ve Element seçicilerdir.

1) CSS ile ".class" seçiciler:

CSS .class değeri ile bir elemente erişmek istediğimizde öncelikli olarak erişilmek istenilen HTML elementinin "class" değeri tespit edilmelidir. HTML "class" değerleri birden çok elemente verilebilmektedir. Bu nedenle "id" yapısı ile keskin bir farkı vardır.

<h1 class='title'>This is a my title</h1>
<h2 class='title'>This is a my title</h2>

Erişim sağlanmak istenen elementin "class" değeri te...