6、属性选择器

    第一种：简单属性选择，示例：img[alt] {border: 5px solid red;}

    第二种：根据具体属性值选择，示例：planet[moons="1"] {color: red;}

    第三种：根据部分属性值选择，示例：img[title~="Figure"] {border: 1px solid gray;}

    更多可参考：http://www.w3school.com.cn/css/css_selector_attribute.asp

7、后代选择器

    根据上下文选择元素，也叫上下文选择器。示例：h1 em {color:red;}

8、子元素选择器

    与后代选择器相比，子元素选择器只能选择作为某元素子元素的元素 

    h1 > strong {color:red;}

    table.company td > p

9、相邻兄弟选择器

    相邻兄弟选择器可选择紧接在另一元素后的元素，且二者有相同父元素。

    如果需要选择紧接在另一个元素后的元素，而且二者有相同的父元素，可以使用相邻兄弟选择器

    示例：如果要增加紧接在 h1 元素后出现的段落的上边距  h1 + p {margin-top:50px;}

10、伪类选择器

    :focus 伪类（无法在 IE 中工作）

    锚伪类

    a:link {color: #FF0000}     /* 未访问的链接 */

    a:visited {color: #00FF00}  /* 已访问的链接 */

    a:hover {color: #FF00FF}    /* 鼠标移动到链接上 */

    a:active {color: #0000FF}   /* 选定的链接 */

    伪元素

    :first-letter   向文本的第一个字母添加特殊样式

    :first-line 向文本的首行添加特殊样式

    :before 在元素之前添加内容

    :after  在元素之后添加内容

CSS