attribute^=value
Định nghĩa và sử dụng “[attribute^=value]” Chọn tất cả thành phần với thuộc tính có giá trị bắt đầu bằng “value”. Giá trị bắt đầu bằng “value” có thể là: value abcvalue abc-value abc_value abc-value-def abc_value_def value-abc value_abc valueabc value-abc value_abc Ghi chú: Màu xanh là màu được chọn. Cấu trúc [attribute^=value] { property: value; } Ví dụ […]
Định nghĩa và sử dụng
- “[attribute^=value]” Chọn tất cả thành phần với thuộc tính có giá trị bắt đầu bằng “value”.
- Giá trị bắt đầu bằng “value” có thể là:
- value
- abcvalue
- abc-value
- abc_value
- abc-value-def
- abc_value_def
- value-abc
- value_abc
- valueabc
- value-abc
- value_abc
Ghi chú: Màu xanh là màu được chọn.
Cấu trúc
[attribute^=value] {
property: value;
}
Ví dụ
Html viết:
<html> <head></head> <body> <p class="test">test</p> <p class="first_test">first-test</p> <p class="first-test">first_test</p> <p class="firsttest">firsttest</p> <p class="firsttestlast">firsttestlast</p> <p class="first_test_last">first-test-last</p> <p class="first-test-last">first_test_last</p> <p class="test_last">test-last</p> <p class="test-last">test_last</p> <p class="testlast">testlast</p> <p>none</p> </body> </html>
Hiển thị trình duyệt khi chưa có CSS:
test
first-test
first_test
firsttest
firsttestlast
first-test-last
first_test_last
test-last
test_last
testlast
none
CSS viết:
p[class^=test]{
color: blue;
}
Hiển thị trình duyệt:
test
first-test
first_test
firsttest
firsttestlast
first-test-last
first_test_last
test-last
test_last
testlast
none
Ta thấy những thành phần p với thuộc tính class có giá trị bắt đầu bằng test đều đã được chọn.
Trình duyệt hỗ trợ
- Internet Explorer
- Firefox
- Opera
- Google Chrome
- Safari
