CSS中有多种选择器，用于选择HTML页面中的不同元素。了解它们之间的区别可以更好地掌握CSS。/ ID 选择器 / example { color: red; } ID选择器以“”字符开头，并根据元...

CSS中有多种选择器，用于选择HTML页面中的不同元素。了解它们之间的区别可以更好地掌握CSS。

/* ID 选择器 */
#example {
  color: red;
} 

ID选择器以“#”字符开头，并根据元素的id属性选择元素。它是唯一的，每个元素只能有一个ID。如果您需要选择一个唯一的元素，请使用ID选择器。

/* 类选择器 */
.example {
  color: blue;
} 

类选择器以“.”字符开头，根据元素的class属性选择元素。一个元素可以有多个类，也可以将一个类应用于多个元素。如果您需要选择多个元素，请使用类选择器。

/* 标签选择器 */
p {
  color: green;
} 

标签选择器选择特定HTML标签的所有元素。如果您需要对整个文档中所有相同标签的元素应用样式，请使用标记选择器。

/* 子选择器 */
ul > li {
  color: purple;
} 

子选择器选择一个元素的直接子元素。例如，可以选择一个列表中的第一级项。它使用大于符号，“>”。

/* 后代选择器 */
div span {
  color: pink;
} 

后代选择器选择一个元素的后代元素，不必是其直接子元素。例如，可以选择一个

/* 相邻兄弟选择器 */
h1 + p {
  color: orange;
}