css选择器有哪些

css选择器有哪些

CSS选择器有多种类型，它们用于在HTML文档中选取特定的元素以应用样式。以下是常见的CSS选择器及其简介：
标签选择器：
说明：以标签名开头，选择所有指定标签的元素。示例：div 选择所有<div>元素。类选择器：
说明：以点(.)加class名开头，选择所有具有该class名的元素。示例：.className 选择所有class="className"的元素。id选择器：
说明：以#加id名开头，具有唯一性，选择具有指定id的元素。示例：#wrap 选择id="wrap"的元素。子选择器：
说明：以>隔开父子级元素，选择直接子元素。示例：div > p 选择所有<div>元素内的直接<p>子元素。包含选择器：
说明：以空格隔开包含关系的元素，选择所有后代元素。示例：div p 选择所有<div>元素内的<p>元素（无论层级）。兄弟选择器：
说明：以~隔开兄弟关系的元素，选择所有后续兄弟元素。示例：h1 ~ p 选择所有与<h1>元素同级的后续<p>元素。相邻选择器：
说明：以+隔开相邻关系的元素，选择紧邻的下一个兄弟元素。示例：h1 + p 选择紧邻在<h1>元素后的第一个<p>元素。全局选择器：
说明：以*开头，选择文档中的所有元素。示例：* 选择所有元素。群选择器：
说明：以,分隔，选择多个选择器匹配的元素。示例：h1, h2, p 选择所有<h1>、<h2>和<p>元素。属性选择器：
说明：以[]包围属性及值，选择具有指定属性的元素。示例：[type="text"] 选择所有type="text"的元素。伪类选择器：
li:first-child：修饰第一个<li>元素。li:last-child：修饰最后一个<li>元素。li:nth-child(n)：修饰第n个<li>元素（n为整数）。li:not(selector)：不修饰匹配指定选择器的<li>元素。这些选择器可以单独使用，也可以组合使用，以实现更精确的选择和样式应用。
2025-04-03