Selektor atrybutu o danej wartości odszukuje każdy element HTML, którego atrybut HTML o podanej przez nas nazwie posiada dokładnie tą wartość, którą podaliśmy.
Selektor atrybutu o danej wartości tworzymy za pomocą nawiasu kwadratowego [], w którym należy umieścić nazwę interesującego nas atrybutu HTML, po której należy umieścić jeden znak = (znak równości), po którym należy podać (pomiędzy cudzysłowem pojedynczym ' lub podwójnym ") interesującą nas wartość.
Informacje techniczne o selektorze [A="V"]
ograniczenie - elementy HTML
brak
ograniczenie - właściwości CSS
brak
Przykładowa reguła CSS, selektor [A="V"]
Wyjaśnienie przykładowej reguły CSS
title
do każdego elementu HTML, którego wartość atrybutu title
=
jest równa
"opis"
wartości opis
color
dodaj właściwość CSS, która zmieni kolor tekstu elementu HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Kurs CSS</title>
<style>
[title="opis"] {
color:red;
}
</style>
</head>
<body>
<div title="przykładowy opis">
tekst znajdujący się w zawartości tego elementu "div" nie jest koloru czerwonego, mimo że ten element HTML posiada atrybut "title", ponieważ wartością atrybutu "title" tego elementu HTML jest wartość "przykładowy opis", a nie wartość "opis"
</div>
<p class="opis">
tekst znajdujący się w zawartości tego elementu "p" nie jest koloru czerwonego, ponieważ ten element HTML nie posiada atrybutu "title" o wartości "opis"
</p>
<div title="opis">
tekst znajdujący się w zawartości tego elementu "div" jest koloru czerwonego, ponieważ ten element HTML posiada atrybutu "title" o wartości "opis"
</div>
</body>
</html>
