Селектор атрибута по дефису в значении

Селектор атрибута по дефису в значении применяет стиль к элементу, значения атрибута которого разделены дефисом.

Пример

Давайте найдем все элементы, у которых в значениях, разделенных дефисом, есть text и перекрасим их в красный цвет:

<p class="text-main-header">text1</p>
<p class="text-content">text2</p>
<p class="test-main">text3</p>
<p class="tag-test">text4</p>

p[class|="text"] {
	color: red;
}

селектор атрибута,
который ищет элемент по имени атрибута
селектор атрибута,
который ищет элемент по значению атрибута
селектор атрибута,
который ищет элемент по началу значения атрибута
селектор атрибута,
который ищет элемент по концу значения атрибута
селектор атрибута,
который ищет элемент по тексту в значении атрибута
селектор атрибута,
который ищет элемент по одному из значений атрибута
Дочерний селектор,
который позволяет выбрать элементы по непосредственной вложенности
Контекстный селектор,
который позволяет выбрать элемент по его родителю
Соседний селектор,
который позволяет выбрать элемент по его соседу
Родственный селектор,
который позволяет выбрать элементы после заданного
Универсальный селектор,
который позволяет выбрать все элементы