CSS常见选择器

CSS（级联样式表）是Web开发中不可或缺的一部分，它使我们能够精确地控制网页的布局和外观。在CSS中，选择器是一种强大的工具，它允许我们指定哪些HTML元素应该应用哪些样式。选择器基于元素的名称、ID、类、属性、位置等来确定哪些元素应该受到样式的影响。在本文中，我们将介绍一些常见的CSS选择器。

1. 元素选择器

元素选择器是最基本的选择器，它基于HTML元素的名称来选择元素。例如，如果你想为所有

元素设置样式，你可以使用p选择器：

p {
  color: red;
}
1
2
3

2. 类选择器

类选择器使用点（.）来表示，并且后面跟着类的名称。例如，如果你想为所有具有highlight类的元素设置样式，你可以使用.highlight选择器：

.highlight {
  background-color: yellow;
}
1
2
3

3. ID选择器

ID选择器使用井号（#）来表示，并且后面跟着ID的名称。ID在页面上应该是唯一的，所以ID选择器通常用于选择单个元素。例如：

#unique-id {
  font-size: 24px;
}
1
2
3

4. 属性选择器

属性选择器允许你根据元素的属性来选择元素。例如，如果你想选择所有具有target="_blank"属性的元素，你可以使用以下选择器：

a[target="_blank"] {
  background-color: lightgray;
}
1
2
3

div p {
  color: blue;
}
1
2
3

div > p {
  font-weight: bold;
}
1
2
3

div + p {
  margin-top: 20px;
}
1
2
3

* {
  box-sizing: border-box;
}
1
2
3

a:hover {
  text-decoration: underline;
}
1
2
3