CSS Selectors || CSS Seçiciler
CSS seçiciler nedir? Nasıl kullanılır?
CSS ile HTML <body></body> elementi içerisinde bulunan bütün elementler seçilebilir ve sahip olduğu tasarımlar değiştirilebilir. Bu konu uzun bir konu olduğundan kaynaklı, ilgili yazıları parçalar hâlinde yazarak, belli başlıklar altında yazmaya karar verdik. Bu başlıklarıımız sırası ile:
a) Temel Seçiciler ,
b) Kombine (Kompleks) Seçiciler ,
c) Attribute (Öz Nitelik) Seçiciler ,
d) Pseudo-class (Sözde Sınıf) Seçiciler ,
e) Pseudo-element (Sözde element) Seçiciler ,
f) "Form" Elementinin Özel Seçicileri ,
g) "A" Elementinin Özel Seçicileri ,
şeklindedir.
Yukarıdaki linklere tıklayarak, ilgili seçim yöntemlerini detaylı bir şekilde görebilirsiniz.
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...