css--Selector

CSS Selector

CSS selectors can be divided into: tag (element) selector, ID selector, class selector, attribute selector, descendant selector, descendant selector, neighbor sibling selector and brother selector ....

Tag Selector:

1 //e {attr:value; attr:value;} 2 P {display:inline; color:#eee;

　　 ID Selector:

//e#id {attr:value; attr:value;} //html<p id= "Pro" >hello Css</p>//cssp#pro {   color:#eee;   }

The ID selector cannot use whitespace, nor can multiple IDs be used

　　 class selector:

//e.class {attr:value; attr:value;} //html<p class= "Pro" >hello Css</p>//cssp.pro {   color:#eee;   }

You can use whitespace between class selectors, such as

<p class= "Pro la" >hello css</p>

At this point the P element applies both. Pro and. La styles, and if the styles overlap, the latter overrides the former.

　 Property Selector:

//html<input type= "text"/>//cssinput[type= "text"] { text-align:center;   }

P[foo= "Bar"]	Apply a style to P element property Foo value bar
P[foo^= "Bar"]	Apply style to P element attribute Foo value starting with bar
P[foo$= "Bar"]	End With bar
P[foo*= "Bar"]	that contains bar

descendant selector:

　　

P span { color:red;   }

Select the applied style of the descendant as span in the P element, and since it is a descendant, there is a generational relationship, rather than a direct descendant.

　 child element selector:　

The difference from the descendant selector is that you can only select a direct descendant to apply the style.

　　adjacent sibling selector:

P+div {}

Only the div next to the P element can be selected

　 Brother selector:

P~div {}

Select the div after the P element that has the same parent element as the P element.

　

　　

css--Selector