IT课程 CSS基础 020_选择器
选择器
选择器用于选择文档中需要样式化的元素，通过不同的选择模式，告诉浏览器哪些元素应用哪些样式。
ID选择器（#）
通过元素的唯一ID来选择元素。ID选择器应该确保在文档中是唯一的，不应重复使用相同的ID。
示例：
#myID { /* 样式规则 */}类选择器（.）
通过元素的类名选择元素。类选择器可以用于多个元素，同一个元素可以拥有多个类。
示例：
.myClass { /* 样式规则 */}元素选择器（p、h1）
通过HTML元素的名称选择元素。元素选择器会选择文档中所有匹配的元素。
示例：
p { /* 样式规则 */}通用选择器（*）
选择文档中的所有元素。通用选择器应该谨慎使用，因为会匹配所有元素，影响性能。
示例：
* { /* 样式规则 */}属性选择器（[type="text"]）
通过元素的属性值选择元素。属性选择器可以根据属性值的不同选择元素。
示例：
input[type="text"] { /* 样式规则 */}伪类选择器
选择元素的特殊状态或位置。伪类选择器用于选择元素的交互状态，如悬停、访问等。
示例：
a:hover { /* 样式规则 */}伪元素选择器
选择元素的特殊部分。伪元素选择器用于选择元素的虚拟部分，如首行、首字母等。
示例：
p::first-line { /* 样式规则 */}子元素选择器
选择某个元素的直接子元素。子元素选择器只选择直接子元素，不包括后代。
示例：
ul > li { /* 样式规则 */}通用兄弟选择器
选择和指定元素有相同父元素的所有兄弟元素。通用兄弟选择器用于选择所有在指定元素后面的兄弟元素，不要求紧邻。
示例：
h2 ~ p { /* 样式规则 */}相邻兄弟选择器
选择紧接在指定元素后面的兄弟元素。相邻兄弟选择器用于选择紧接在指定元素后面的兄弟元素。
示例：
h2 + p { /* 样式规则 */}后代选择器
选择某个元素下的所有后代元素。后代选择器会选择指定元素下的所有后代，包括嵌套层次深的元素。
示例：
div p { /* 样式规则 */}并集选择器（,）
将多个选择器组合在一起，选择所有匹配任一选择器的元素。并集选择器用于同时选择多个不同类型的元素，并应用相同的样式规则。
示例：
h1, h2, h3 { /* 样式规则 */}选择器列表
将多个选择器按照优先级顺序列举，选择最匹配的一个。选择器列表允许按照不同的选择器组合选择多个元素，以满足不同条件的样式需求。
示例：
div p,.myClass,#myID { /* 样式规则 */}选择器命名规则
选择器的名称必须是字母数字、下划线或连字符组成的字符串。
选择器的名称必须以字母或下划线开头。
选择器的名称不能以数字开头。
选择器的名称不能包含空格。
建议：
使用有意义的名字： 选择器的名字应该能够清晰地反映出所选择元素的作用或用途。
遵循命名约定： 使用一致的命名约定，如驼峰式命名或短横线连接命名，以提高代码的一致性。
避免使用无意义的缩写： 避免使用过于简短或无意义的缩写，使得其他开发者也能理解选择器的含义。
遵循语义化： 使用具有语义化的选择器，以提高代码的可读性和维护性。