CSS 选择器
选择器用于选中需要 styled 的 HTML 元素。
1. 基础选择器
| 选择器 | 示例 | 说明 |
|---|
| 元素选择器 | p { } | 选中所有 p 标签 |
| 类选择器 | .classname { } | 选中 class="classname"的元素 |
| ID 选择器 | #myid { } | 选中 id="myid"的元素（唯一） |
| 通配符 | * { } | 选中所有元素 |
2. 组合选择器
/* 后代选择器 */
div p { color: red; }
/* 子元素选择器 */
div > p { color: blue; }
/* 相邻兄弟选择器 */
h1 + p { font-size: 18px; }
/* 群组选择器 */
h1, h2, h3 { color: #333; }
3. 属性选择器
/* 有 href 属性的元素 */
a[href] { color: blue; }
/* href 以 https 开头 */
a[href^="https"] { color: green; }
/* href 包含 .pdf */
a[href*=".pdf"] { color: red; }
4. 伪类选择器
a:hover { color: orange; }
li:first-child { font-weight: bold; }
p:nth-child(2) { color: blue; }
相关文章：CSS 简介 | CSS 颜色和背景
|
