请列举 CSS 中的选择器类型，并分别说明它们各自的作用和适用场景。

回答思路

1. 【回答框架 1】CSS 选择器用于匹配 HTML 元素并施加样式。基础选择器包括元素选择器（如 p）、类选择器（.class）、ID 选择器（#id）、通配符选择器（*），其中 ID 选择器具有唯一性，类选择器可复用，元素选择器影响面最广。
2. 【回答框架 2】属性选择器根据元素的属性或属性值匹配，如 [type='text']、[href^='https']，支持 =、~=、|=、^=、$=、*= 等匹配方式。
3. 【回答框架 3】组合器包括后代选择器（空格）、子选择器（>）、相邻兄弟选择器（+）、通用兄弟选择器（~），它们通过元素在文档树中的关系来缩小选择范围，其中子选择器只匹配直接子元素。
4. 【回答框架 4】伪类选择器基于元素的状态或位置进行匹配，如 :hover、:focus、:first-child、:nth-child(n)；伪元素选择器（如 ::before、::after）则用于选中元素的一部分或生成内容，注意伪元素使用双冒号区分于伪类。
5. 【回答框架 5】现代 CSS 还支持 :is()、:not()、:where() 等相对较新的选择器，它们能组合或排除其他选择器，提高选择器的可读性与灵活性，但需考虑浏览器兼容性。
6. 【关键点 1】选择器分为基础、属性、组合、伪类和伪元素等几大类。
7. 【关键点 2】伪元素用双冒号，伪类用单冒号，二者概念不同。
8. 【关键点 3】nth-child 和 nth-of-type 的计数基数和目标不同，不要混淆。
9. 【关键点 4】属性选择器支持多种匹配运算符，可精确控制匹配条件。
10. 【关键点 5】复杂选择器性能开销通常更高，应避免过度嵌套。
11. 【易错点 1】忘记区分伪类与伪元素，导致样式失效或语义错误。
12. 【易错点 2】将 descendant 选择器与 child 选择器混用，造成元素选中范围错误。
13. 【易错点 3】滥用 ID 选择器或通配符选择器导致性能下降或样式难以维护。