How to use the property selector of CSS
This article mainly introduces how to use CSS's attribute selector, which is very detailed and has a certain reference value. Friends who are interested must finish reading it!
Styles the HTML element with the specified attribute.
You can style HTML elements that have specified attributes, not just the class and id attributes.
Note: IE7 and IE8 support property selectors only when! DOCTYPE is specified. Attribute selection is not supported in IE6 and earlier versions.
Attribute selector
The following example sets the style for all elements with the title attribute:
[title]
{
Color:red
}
Property and value selector
The following example styles all elements of the title= "W3School":
[title=hello]
{
Border:5pxsolidblue
}
Property and value Selector-multiple valu
The following example sets the style for all elements that contain the title attribute of the specified value. Applies to property values separated by spaces:
[title~=hello] {color:red;}
The following example sets the style for all elements with the lang attribute that contains the specified value. Applies to property values separated by hyphens:
[lang | = en] {color:red;}
Set the style of the form
The property selector is especially useful when styling a form without class or id:
Input [type= "text"]
{
Width:150px
Display:block
Margin-bottom:10px
Background-color:yellow
Font-family:Verdana,Arial
}
Input [type= "button"]
{
Width:120px
Margin-left:35px
Display:block
Font-family:Verdana,Arial
}
The above is all the content of the article "how to use the property Selector of CSS". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!
