CSS [атрибут~=значение] селектор

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

CSS [атрибут~=значение] Селекторы используются для выбора элементов, атрибуты которых содержат определенное слово.

Следующий пример будет соответствовать элементам title="flower", title="summer flower" и title="flower new", но не будет соответствовать элементам title="my-flower" или title="flowers".

Пример

Выберите и установите стили для всех элементов, атрибут title которых содержит слово "flower":

[title~="flower"] {
  border: 5px solid green;
}

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

Грамматика CSS

[атрибут ~= значение] {
  css declarations;
}

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

Поддержка браузерами

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