Spesifik Özellikler ile Stil HTML Elemanları
Belirli özelliklere sahiptir veya özellik değerleri HTML öğelerini şekil verilmesi mümkündür.
CSS [özellik] Seçici
[attribute] seçici bir belirtilen özelliğin sahip elemanları seçmek için kullanılır.
Aşağıdaki örnek, tüm seçer <a> bir hedef niteliği ile unsurlarını:
CSS [öznitelik = "değer"] Seçici
[attribute="value"] seçici bir belirtilen özelliğin ve değer elemanları seçmek için kullanılır.
Aşağıdaki örnek, tüm seçer <a> bir ile unsurlarını target="_blank" niteliği:
CSS [öznitelik, = "değer"] Seçici
[attribute~="value"] seçici belirli bir kelime ihtiva eden bir özellik değerine sahip elemanları seçmek için kullanılır.
Aşağıdaki örnek, "bunlardan biri bir deyişle, bir boşluk ile ayrılmış listesini içeren bir başlık niteliği olan tüm elemanları seçer flower ":
Yukarıdaki örnek ile unsurlarını maç olacak title="flower", title="summer flower" ve title="flower new" değil, title="my-flower" veya title="flowers" .
CSS [özellik | = "değer"] Seçici
[attribute|="value"] seçici olan elemanları seçmek için kullanılır specified belirtilen değer ile başlayan öznitelik.
Aşağıdaki örnek ile başlayan bir sınıf, özellik değeri tüm öğeleri seçer "top" :
Not: Bu değer bütün bir kelime olmalı, gibi yalnız ya class="top" tire ile ya takiben ( - ) , gibi class="top-text" !
CSS [öznitelik ^ = "değer"] Seçici
[attribute^="value"] seçici olan özellik değeri belirli bir değeri ile başlar elemanları seçmek için kullanılır.
Aşağıdaki örnek ile başlayan bir sınıf, özellik değeri tüm öğeleri seçer "top" :
Not: Bu değer bütün bir kelime olmak zorunda değil!
CSS Seçici [$ = "değer" öznitelik]
[attribute$="value"] seçici olan özellik değeri belirli bir değer ile sona elemanları seçmek için kullanılır.
Aşağıdaki örnek ile sona eren bir sınıfı, özellik değeri tüm elemanları seçer "test" :
Not: Bu değer bütün bir kelime olmak zorunda değil!
CSS [öznitelik * = "değer"] Seçici
[attribute*="value"] seçici olan özellik değeri belirli bir değeri içeren elemanlar seçmek için kullanılır.
Aşağıdaki örnek içeren bir sınıfı, özellik değeri tüm elemanları seçer "te" :
Not: Bu değer bütün bir kelime olmak zorunda değil!
Şekillendirme Formları
Özelliği, seçiciler olmadan şekillendirme formları için yararlı olabilir class ya da ID :
Örnek
input[type="text"]
{
width: 150px;
display: block;
margin-bottom: 10px;
background-color: yellow;
}
input[type="button"]
{
width: 120px;
margin-left: 35px;
display: block;
} Kendin dene " İpucu: Lütfen edin CSS Formlar Eğitimi CSS ile formları stil konusunda daha fazla örnek için.
Egzersizleri ile Yourself test edin!
Egzersiz 1 » Alıştırma 2» Egzersiz 3 » Egzersiz 4» Egzersiz 5 » Egzersiz 6»
CSS Selectors Daha Örnekleri
Bizim kullanın CSS Seçici Tester farklı seçicileri göstermek için.
Tüm CSS seçicileri tam Referans için, bizim gidin lütfen CSS Seçiciler Referans .