css-attribute-oznitelik

Belirli Niteliklerle Stil HTML Öğeleri

Belirli niteliklere veya özellik değerlerine sahip HTML öğelerini stillemek mümkündür.

[attribute]Seçici belirli bir özelliği olan unsurları seçmek için kullanılır.

Koşeli Parantezın ıcındekı öznitrlik

a[target] {

background-color: yellow;

}



[attribute="value"]Seçici bir belirtilen özelliğin ve değer elemanları seçmek için kullanılır.

a[target="_blank"] {

background-color: yellow;

}

[attribute~="value"]Seçici belirli bir kelime ihtiva eden bir özellik değerine sahip elemanları seçmek için kullanılır.

[title~=flower] {

border: 5px solid yellow;

}

< /style>

< img src="img_flwr.gif" title="flower" width="224" height="162">

< img src="img_tree.gif" title="tree" width="200" height="358">



[attribute|="value"]Seçici belirtilen değer ile başlayarak belirtilen niteliğiyle elemanları seçmek için kullanılır.

[class|=top] {

background: yellow;

}

< p class="top-text">arkaplan sarı</p>

< p class="topcontent">İşlem yok</p>

[attribute^="value"]Seçici olan özellik değeri belirli bir değeri ile başlar elemanları seçmek için kullanılır.

[class^="top"] {

background: yellow;

}

< p class="top-text">arkaplan sarı</p>

< p class="topcontent">arkaplan sarı</p>

[attribute$="value"]Seçici olan özellik değeri belirli bir değer ile sona elemanları seçmek için kullanılır.

[class$="test"] {

background: yellow;

}

< div class="first_test">arkaplan sarı</div>

< div class="second">işlem yok</div>

[attribute*="value"]Seçici olan özellik değeri belirli bir değeri içeren elemanlar seçmek için kullanılır.

[class*="te"] {

background: yellow;

}

< div class="first_test">arkaplan sarı</div>

< div class="second">işlem yok</div>