Başlangıç CSS
CSS , belgedeki hangi öğeye hangi stilin uygulanacağını belirlemek için desen eşleme kurallarına dayanır. Bu kalıplara seçiciler denir ve bunlar, etiket adlarından (örneğin, p paragraf etiketleriyle eşleşecek şekilde) bir belgenin çok özel bölümleriyle eşleşen çok karmaşık modellere kadar değişir (örneğin, p # myid> b.highlight, herhangi bir b etiketiyle eşleşir) id myid ile paragrafın alt öğesi olan bir vurgu sınıfı.
Bir CSS seçici, web sayfasının hangi bölümünün stil oluşturulacağını tanımlayan bir CSS stili çağrısının parçasıdır. Seçici, seçilen HTML'nin nasıl biçimlendirileceğini tanımlayan bir veya daha fazla özellik içerir.
CSS Seçicileri
Birkaç farklı seçim türü vardır:
- tip seçiciler — belirli bir öğeyle eşleştirme
- sınıf seçiciler — belirli bir sınıfla öğeleri eşleştirme
- Kimlik seçicileri - öğeyi belirli bir kimlikle eşleştiriyor
- soyundan gelen seçiciler - belirli bir elementin torunları olan unsurları eşleştirmek
- çocuk seçiciler — belirli elemanın çocuğu olan eşleştirme öğeleri
- evrensel seçiciler
- bitişik kardeş seçimi - belirli bir elemanın hemen önündeki elemanları eşleştirme
- özellik seçicileri — belirli bir özellik veya özellik değerine sahip öğeleri eşleme
- sözde sınıf seçiciler — belirli bir sözde sınıfı olan öğeleri eşleştirme
- sözde öğe seçicileri — belirli sözde öğe özellikleriyle eşleşen öğeleri eşleme
CSS Stillerini ve CSS Seçicilerini Biçimlendirme
Bir CSS stilinin biçimi şu şekildedir:
seçici {style özelliği: stil; }
Aynı stile sahip birden çok seçiciyi virgülle ayırın. Bu seçici gruplama denir. Örneğin:
selector1 , selector2 {style özelliği: stil; }
Gruplama seçiciler, CSS stillerinizi kompakt tutmak için kullanılan kısa bir mekanizmadır.
Yukarıdaki gruplama, aşağıdakilerle aynı etkiye sahip olacaktır:
selector1 {style özelliği: stil; }
selector2 {style özelliği: stil; }
Her Zaman CSS Seçicilerinizi Test Edin
Tüm tarayıcılar tüm CSS seçicilerini desteklemez. Bu yüzden, seçicilerinizi olabildiğince çok sayıda işletim sisteminde tarayıcıda test ettiğinizden emin olun. Fakat CSS 1 veya CSS2 seçicileri kullanıyorsanız, iyi olmalısınız.