CSS选择器有哪些？哪些属性可以继承？

CSS选择器有很多种，大致可以分为以下几类：

1. 基本选择器:

• 元素选择器: 选择所有指定类型的HTML元素。例如 p 选择所有 <p> 元素。
• 类选择器: 选择所有带有特定class属性的HTML元素。例如 .highlight 选择所有class包含 "highlight" 的元素。
• ID选择器: 选择带有特定id属性的HTML元素。例如 #main-content 选择id为 "main-content" 的元素。
• 通用选择器: 选择所有HTML元素。例如 * 选择所有元素。

2. 组合选择器:

• 后代选择器: 选择指定元素的所有后代元素。例如 div p 选择所有 <div> 元素内的 <p> 元素，无论嵌套层级。
• 子选择器: 选择指定元素的直接子元素。例如 div > p 只选择 <div> 的直接子元素 <p>，不包括更深层嵌套的 <p>。
• 相邻兄弟选择器: 选择紧接在指定元素后的兄弟元素。例如 h1 + p 选择紧跟在 <h1> 元素后的第一个 <p> 元素。
• 通用兄弟选择器: 选择指定元素后的所有兄弟元素。例如 h1 ~ p 选择 <h1> 元素后的所有 <p> 元素。

3. 属性选择器:

• [attribute]: 选择拥有指定属性的元素。例如 [title] 选择所有拥有 title 属性的元素。
• [attribute=value]: 选择属性值等于特定值的元素。例如 [title="Important"] 选择 title 属性值为 "Important" 的元素。
• [attribute~=value]: 选择属性值包含特定单词的元素。单词之间用空格分隔。例如 [class~="warning"] 选择 class 属性包含 "warning" 的元素。
• [attribute|=value]: 选择属性值等于特定值或以该值开头并后跟连字符的元素。常用于语言子代码。例如 [lang|="en"] 选择 lang 属性值为 "en" 或 "en-US" 的元素。
• [attribute^=value]: 选择属性值以特定值开头的元素。例如 [href^="https"] 选择 href 属性值以 "https" 开头的元素。
• [attribute$=value]: 选择属性值以特定值结尾的元素。例如 [src$=".jpg"] 选择 src 属性值以 ".jpg" 结尾的元素。
• [attribute*=value]: 选择属性值包含特定值的元素。例如 [title*="important"] 选择 title 属性值包含 "important" 的元素。

4. 伪类选择器:

• 🔗 选择未访问的链接。
• :visited: 选择已访问的链接。
• :hover: 选择鼠标悬停的元素。
• :active: 选择被激活的元素（例如，被点击的链接）。
• :focus: 选择获得焦点的元素（例如，表单输入框）。
• :first-child: 选择父元素的第一个子元素。
• :last-child: 选择父元素的最后一个子元素。
• :nth-child(n): 选择父元素的第 n 个子元素。
• :nth-last-child(n): 选择父元素的倒数第 n 个子元素。
• :nth-of-type(n): 选择父元素的第 n 个特定类型的子元素。
• :nth-last-of-type(n): 选择父元素的倒数第 n 个特定类型的子元素。
• :only-child: 选择是父元素唯一子元素的元素。
• :only-of-type: 选择是父元素唯一特定类型子元素的元素。
• :empty: 选择没有子元素的元素。
• :not(selector): 选择不匹配指定选择器的元素。
• :checked: 选择被选中的表单元素（例如，单选框或复选框）。
• :disabled: 选择被禁用的表单元素。
• :enabled: 选择未被禁用的表单元素。
• :target: 选择当前 URL 的目标元素（带有锚点）。

5. 伪元素选择器:

• ::before: 在元素内容之前插入内容。
• ::after: 在元素内容之后插入内容。
• ::first-letter: 选择元素的第一个字母。
• ::first-line: 选择元素的第一行。

---