css选择器相关

/*选择 title 属性包含单词 "flower" 的所有元素。*/
[title~=flower] {
border:5px solid yellow;
}
/*选择获得焦点的输入字段，并设置其样式：*/
input:focus {
    background-color:yellow;
}

div,p    选择所有 <div> 元素和所有 <p> 元素。    
div p    选择 <div> 元素内部的所有 <p> 元素。    
div>p    选择父元素为 <div> 元素的所有 <p> 元素。    
div+p    选择紧接在 <div> 元素之后的所有 <p> 元素。

1、first-child

first-child表示选择列表中的第一个标签。代码如下：

li:first-child{background:#090}

上面的意思是，li 列表中的 第一个li模块的背景颜色。

2、last-child

last-child表示选择列表中的最后一个标签，代码如下：

li:last-child{background:#090}

3、nth-child(3)

表示选择列表中的第3个标签，代码如下：

li:nth-child(3){background:#090}

上面代码中的3也可以改成其它数字，如4、5等。想选择第几个标签，就填写几。

4、nth-child(2n) 

这个表示选择列表中的偶数标签，即选择 第2、第4、第6…… 标签。

5、nth-child(2n-1)

这个表示选择列表中的奇数标签，即选择 第1、第3、第5、第7……标签。

6、nth-child(n+3)

这个表示选择列表中的标签从第3个开始到最后。

7、nth-child(-n+3)

这个表示选择列表中的标签从0到3，即小于3的标签。

8、nth-last-child(3)

这个表示选择列表中的倒数第3个标签。