Detailed explanation of the use of CSS attribute selectors (css introductory tutorial)

Set styles for HTML elements with specified attributes. (Recommended learning: CSS Getting Started Tutorial)

You can set styles for HTML elements with specified attributes, not just class and id attributes.

Note: IE7 and IE8 only support attribute selectors when !DOCTYPE is specified. In IE6 and lower, attribute selection is not supported.

Attribute Selector

The following example sets the style for all elements with the title attribute:

[title]
{
color:red;
}

Attribute and value selector

The following example styles all elements with title="W3School":

[title=hello]
{
border:5px solid blue;
}

Attribute and value selectors - multiple values

The following example sets styles for all elements that contain a title attribute with a specified value. Applies to attribute values ​​separated by whitespace:

[title~=hello] { color:red; }

The following example styles all elements with a lang attribute that contains the specified value. Applies to attribute values ​​separated by hyphens:

[lang|=en] { color:red; }

Setting the style of the form

The attribute selector is special when styling the form without a class or id Useful:

The above is the detailed content of Detailed explanation of the use of CSS attribute selectors (css introductory tutorial). For more information, please follow other related articles on the PHP Chinese website!