Shulou(Shulou.com)06/02 Report--

This article mainly explains "what are the attribute selectors in css3". The content in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "what are the attribute selectors in css3".

There are three kinds of attribute selectors in css3: 1, "[attribute name ^ = value]", matching each element whose attribute value begins with the specified value; 2, "[attribute name $= value]", matching every element whose attribute value ends with the specified value; and 3, "[attribute name * = value]", matching each element with the specified value in the attribute value.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

Three kinds of attribute selectors in css3

The attribute selector description example shows that CSS [attribute^ = value] matches each element whose attribute value begins with the specified value a [src ^ = "https"] selects each src attribute whose value begins with "https" 3 [attribute$=value] matches each element whose value ends with the specified value a [src $= ".pdf"] selects the value of each src attribute 3 [attribute*=value] that ends with ".pdf" in the package Each element with the specified value a [src * = "44lan"] Select element 3 whose value contains the substring "44lan" for each src attribute

[attribute^ = value] attribute selector

The [attribute ^ = value] selector matches the element whose attribute value begins with the specified value.

Example:

Sets the background color of all div elements whose class attribute value begins with "test"

Div {background:#ffff00;} The first div element.The second div element.The third div element.This is some text in a paragraph.

[attribute$=value] attribute selector

The [attribute$=value] selector matches the element whose attribute value ends with the specified value.

Example:

Sets the background color of all elements whose class attribute value ends with "test":

[class$= "test"] {background:#ffff00;} The first div element.The second div element.The third div element.This is some text in a paragraph.

[attribute*=value] attribute selector

The [attribute*=value] selector matches the element whose attribute value contains the specified value.

Example:

Sets the background color of all elements whose class property value contains "test"

[class*= "test"] {background:#ffff00;} The first div element.The second div element.The third div element.This is some text in a paragraph.

Thank you for your reading, these are the contents of "attribute selector in css3". After the study of this article, I believe you have a deeper understanding of what the attribute selector in css3 has, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.