CSS选择器

说明：JavaScript/jQuery中也可以使用类似于CSS中的选择器进行元素的选择。

  (1)通用选择器： *{...}  选择页面中的所有元素

  (2)元素选择器：元素名{...} 选择指定的元素如div{...}

  (3)ID选择器：#ID值{...} 仅选择具有指定ID的元素 如#p2{...}

  (4)类别选择： .类名{...}选择具有指定class的所有元素  .mark{}

  (5)并列/过滤选择器：选择器1选择器2{...} 选择可被两个选择器同时选定的元素  如p.mark{...}  或.product.mark{...}

  (6)子元素选择器：选择器1  选择器2{...}   选择可被选择器1选择的元素下的所有子元素中可被选择器2选中的元素 如div span{...}     .product  .mark{...}

  (7)直接子元素选择器  选择器1>选择器2{...}  选中选择器1中的直接子元素中可被选择器2选中的  如div > span{...} IE6不支持

  (8)多选/群组选择器：选择器1,选择器2,...选择器n{...}  选择可被任何一个选择器选中的元素   h2,#main,.mark{...}

  (9)伪类选择器： :伪类名{...}  

  (10)相邻兄弟选择器  选1 + 选2 选择紧挨的下一个兄弟元素

  (11)选1 ~ 选2 通用兄弟选择器 匹配和选择器1是兄弟的选择器2  div ~ span 表示和div是兄弟的span都选上

a:link{...} 选择所有未访问过的超链接

a:visited{...} 选择所有访问过的超链接

元素:hover{...} 当鼠标悬停于元素上方时  IE6只支持a:hover

元素:active{...} 当元素被激活时

input:foucs{...} 当元素获得输入焦点  IE7前都不支持

 .test-content,  .test-title .test-content  逗号表示同级，A或者B

color:red !important

important用法，在属性之后

面试题：CSS样式的优先级  !important > 内联样式 > #ID选择器>类选择器/伪类选择器>元素选择器>浏览器预定义样式