Comprehensive analysis of css attribute selectors

1.[class~="flower"]: Select the class with flower

class="flower ss"

class="ss flower"

2 .[class|='top']: To select a class starting with top, it needs to be connected with '—' or a separate top

class="top-ss"

class=" top"

　class="top-ss"//Unselected

3.[class^="top"]: Select items starting with top regardless of whether there are special symbols connected. A separate top can also be used

class="top-ss"

class="topss"

4.[class$="top"]: Select top as The ending class can also be a separate top

class="mytop"

class="my-top"

class="top"

5.[class*='tt']: Select the class with two letters tt regardless of its position

　class="sttd"

　class="ttee"

　class="eett"

6.[target=_blank]

There is target =_blank selected in the a tag

7.input[type="button" ]

The above article is all about the comprehensive understanding of CSS attribute selectors that the editor has shared with you. I hope it can give you a reference, and I also hope that everyone will support the PHP Chinese website.

For more comprehensive analysis of CSS attribute selector-related articles, please pay attention to the PHP Chinese website!