Selektor atrybutu, którego wartość kończy się danym ciągiem znaków
- Data publikacji
- Ostatnio edytowano
Zobacz również: w3.org - substring matching attribute selectors (LV3)
Przeznaczenie selektora [A$="V"]
[atrybut$="ciąg"] { ... }
Selektor atrybutu, którego wartość kończy się danym ciągiem znaków odszukuje każdy element HTML, którego wartość atrybutu HTML o podanej przez nas nazwie kończy się ciągiem znaków, który podaliśmy.
Selektor atrybutu, którego wartość kończy się danym ciągiem znaków 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ć znaki $=
(dolar oraz znak równości), po których należy podać (pomiędzy cudzysłowem pojedynczym '
lub podwójnym "
) interesujący nas ciąg znaków.
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"]
[title$="opis"] {
color:red;
}
Wyjaśnienie przykładowej reguły CSS
[title$="opis"] { color:red; }
title
-
do każdego elementu HTML, którego wartość atrybutu
title
$=
-
kończy się
"opis"
-
ciągiem znaków
opis
color
-
dodaj właściwość CSS, która zmieni kolor tekstu elementu HTML
red
-
na barwę czerwoną
Kod źródłowy przykładowego dokumentu HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
[title$="opis"] {
color:red;
}
</style>
</head>
<body>
<div title="opisElementuHTML">
tekst znajdujący się w zawartości tego elementu "div" nie jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML nie kończy się ciągiem znaków "opis"
</div>
<p title="to jest opis elementu HTML">
tekst znajdujący się w zawartości tego elementu "p" nie jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML nie kończy się ciągiem znaków "opis"
</p>
<p title="brudnopis">
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML kończy się ciągiem znaków "opis"
</p>
<div title="opis">
tekst znajdujący się w zawartości tego elementu "div" jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML kończy się ciągiem znaków "opis"
</div>
</body>
</html>
Rezultat
tekst znajdujący się w zawartości tego elementu "p" nie jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML nie kończy się ciągiem znaków "opis"
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ wartość atrybutu "title" tego elementu HTML kończy się ciągiem znaków "opis"
Interpretacja selektora [A$="V"]
-
tak
-
tak
-
tak
-
tak
-
tak
-
tak
Zobacz więcej informacji o interpretacji selektora [A$="V"].