CSS选择器区别
"竞争永远只有一个冠军，但我们依然可以选择做自己的盖世英雄。赶快披上漂亮的CSS外衣，好好表现自己一番吧。"
——有心人做有心事哦，晚安EmilyChen！
（一）单一
| 【1】属性选择器 | ||
|---|---|---|
| p[alt] | 选择具有att属性的 | p元素 |
| p[alt="val"] | 选择att属性值 | 等于val的p |
| p[alt^="val"] | 匹配att属性值 | 以val开头的p |
| p[alt$="val"] | 匹配att属性值 | 以val结尾的p |
| p[alt*="val"] | 匹配att属性值 | 含有val的p |
【2】id选择器
<h1 id="goods">建下锚点
<a href="#goods">接上连结
（二）复合
| 【3】伪类 | ||
|---|---|---|
| 常见伪类（DOM已有元素，单冒号） | :hover | 鼠标经过 |
| :focus | 焦点 | |
| 结构伪类（DOM已有元素，单冒号） | p：first-child | 匹配父元素中的第一个子元素p |
| p：last-child | 父元素中的最后一个p | |
| p：nth-child（n） | 父元素中的第n个p | |
| 公式 | n是数字、关键字，从0算起 | |
| 2n | 偶数even | |
| 2n+1 | 奇数odd | |
| 5n | 5 10 15 | |
| n+5 | 从第5个开始（包含第5个） | |
| -n+5 | 选择前5个 | |
| p：first-of-type | 指定类型E的第一个 | |
| p：last-of-type | 指定类型E的最后一个 | |
| p：nth-of-type（n） | 指定类型E的第n个 | |
| 伪元素（创建DOM元素，但属于行内元素（用于盒子里的小图标），双冒号） | p::before | p元素内容的前面,加content（必须） |
| p::after | p元素内容的后面,加content（必须） |
赞 (0)