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

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

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

пример

пример 1

выберите и установите стиль для всех элементов <a> с атрибутом target="_blank". Также выберите и установите стиль для всех элементов <p> с атрибутом lang="it":

a[target="_blank"] {
  background-color: yellow;
}
p[lang="it"] {
  background-color: salmon;
}

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

пример 2

установите ширину элемента <input type="text"> в 100px. Однако, когда он получает фокус, установите его ширину в 250px:

input[type="text"] {
  width: 100px;
}
input[type="text"]:focus {
  width: 250px;
}

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

грамматика CSS

[attribute = value] {
  css declarations;
}

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

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

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