Последний тип селекторов атрибутов, селектор конкретного атрибута (particular attribute selector), проще показать, чем описать. Рассмотрим следующее правило:
*[lang|="en"] {color: white;}
Это правило будет выбирать любой элемент, чей атрибут lang эквивалентен en или начинается с en-. Поэтому первые три элемента следующего примера разметки будут выбраны, а последние два – нет:
<h1 lang="en">Hello!</h1>
<p lang="en-us">Greetings!</p>
<div lang="en-au">G'day!</div>
<p lang="fr">Bonjour!</p>
<h4 lang="cy-en">Jrooana!</h4>
В общем, форма [атрибут|="значение"] может применяться для любого атрибута и его значений. Скажем, в HTML-документе есть наборы рисунков, каждый из которых хранится в файле с именем, например figure-1.gif или figure-3.jpg. Все эти изображения можно выбрать посредством следующего селектора:
img[src|="figure"] {border: 1px solid gray;}
Чаще всего этот тип селекторов атрибутов применяется для сопоставления значений языков, как будет показано в этой главе позже.