Bộ chọn thuộc tính theo dấu gạch ngang trong giá trị

Bộ chọn thuộc tính theo dấu gạch ngang trong giá trị áp dụng kiểu cho phần tử, giá trị thuộc tính của nó được phân tách bằng dấu gạch ngang.

Ví dụ

Hãy tìm tất cả các phần tử có trong các giá trị được phân tách bằng dấu gạch ngang chứa text và đổi màu của chúng thành đỏ:

<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;
}

bộ chọn thuộc tính,
tìm phần tử theo tên thuộc tính
bộ chọn thuộc tính,
tìm phần tử theo giá trị thuộc tính
bộ chọn thuộc tính,
tìm phần tử theo phần đầu giá trị thuộc tính
bộ chọn thuộc tính,
tìm phần tử theo phần cuối giá trị thuộc tính
bộ chọn thuộc tính,
tìm phần tử theo văn bản trong giá trị thuộc tính
bộ chọn thuộc tính,
tìm phần tử theo một trong các giá trị của thuộc tính
Bộ chọn con,
cho phép chọn phần tử theo quan hệ lồng nhau trực tiếp
Bộ chọn ngữ cảnh,
cho phép chọn phần tử theo phần tử cha của nó
Bộ chọn láng giềng liền kề,
cho phép chọn phần tử theo phần tử láng giềng của nó
Bộ chọn anh chị em chung,
cho phép chọn các phần tử sau phần tử đã cho
Bộ chọn phổ quát,
cho phép chọn tất cả các phần tử