Przejdź do treści

Selektory atrybutów

Selektor atrybutu zawierającego łączniki

selektor[atrybut|="początek"] { cecha: wartość }
Selektorem może być dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli i inne [zobacz: Wstawianie stylów].

Atrybut oznacza konkretny parametr nadany znacznikowi z poziomu (X)HTML (np. atrybut lang="..."), którego wartość składa się z wyrazów rozdzielonych łącznikami (myślnikami).

"Początek" to określony wyraz, od którego rozpoczyna się wartość atrybutu.

Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach.

Polecenie to może zostać wykorzystane dla elementów, którym z poziomu (X)HTML został nadany atrybut, o wartości składającej się z kilku wyrazów rozdzielonych łącznikami (myślnikami). Reguła taka pozwala nadać konkretne cechy elementom, posiadającym atrybut, którego wartość rozpoczyna się od podanego wyrazu. Na przykład składnia lang|="en" kojarzy atrybuty: lang="en-us" lub lang="en-au", jak również lang="en".

Selektor taki został przewidziany do obsługi języków (atrybut LANG), których skróty zawierają często łączniki (np. "en-us" to język angielski w Stanach Zjednoczonych, "en-au" to język angielski w Australii).

UWAGA! Polecenie nie interpretuje MSIE 6 (od wersji 7 wszystko jest już w porządku).

W języku XHTML wszystkie atrybuty w selektorach muszą być pisane małymi literami.

Przykład:

Jeżeli w arkuszu stylów strony została umieszczona następująca reguła: 
p[title|="to"] { color: red }
to każdy akapit, któremu został nadany atrybut TITLE z wartością, która rozpoczyna się od "to" (i może składać się z łączników), powinien mieć kolor czerwony:

To jest akapit, któremu został nadany atrybut title="to-jest-akapit" (aby to sprawdzić, wskaż go myszką) i dlatego jest koloru czerwonego.

A to jest akapit z atrybutem title="to-też-jest-akapit" i też powinien być czerwony.

Dla porównania, to jest akapit bez atrybutu TITLE.

A to jest akapit z atrybutem title="także-i-to-jest-akapit" (nie powinien być czerwony)

Pierwszy i drugi z podanych wyżej akapitów powinny być czerwone. Natomiast trzeci i czwarty nie. Jeśli używasz Internet Explorera 6, żaden akapit nie będzie czerwony.

Zobacz także

atrybut (12)

Komentarze

Zobacz więcej komentarzy

Dotacje

Pomogła Ci ta strona? Chcesz, aby dalej się rozwijała?
Dotpay - Bezpieczne transakcje internetowePayPalWpłać dobrowolną dotację...