CSS [attribute|=value] селектор

определение и использование

CSS [attribute|=value] селекторы используются для выбора элементов с указанным свойством и полным совпадением значения свойства или началом с указанным значением и дефисом (-).

внимание:значение должно быть полным словом, либо появляться в одиночку, например lang="en", либо следовать дефису (-), например lang="en-us".

пример

пример 1

выберите и установите стиль элементов с атрибутом lang, равным "en" или "en-":

[lang|="en"] {
  background-color: yellow;
}

попробуйте сами

пример 2

выберите и установите стиль элементов с атрибутом class, равным "top" или "top-":

[class|="top"] {
  background-color: yellow;
}

попробуйте сами

грамматика CSS

[attribute |= value] {
  css declarations;
}

технические детали

поддержка браузеров

числа в таблице показывают первую версию браузера, которая полностью поддерживает этот селектор.