CSS Id 和 Class

在 CSS 中，我们经常会使用 id 和 class 来为 HTML 元素添加样式。这两种选择器在实际开发中起着非常重要的作用，让我们来深入了解它们的用法和区别。

1. CSS Id

在 HTML 中，id 是用来唯一标识一个元素的属性。在 CSS 中，我们可以使用 id 选择器来为具有特定 id 值的元素添加样式。

#myElement {
  color: red;
  font-size: 16px;
}

在上面的示例中，我们使用 #myElement 来选择 id 为 myElement 的元素，并为其设置了红色的文本颜色和 16px 的字体大小。

需要注意的是，id 选择器是具有最高优先级的选择器，意味着如果多个选择器同时作用于同一个元素，id 选择器的样式会覆盖其他选择器的样式。

2. CSS Class

与 id 不同，class 是可以被多个元素共享的属性。我们可以使用 class 选择器来为具有相同 class 值的元素添加样式。

.myClass {
  background-color: #f0f0f0;
  padding: 10px;
}

在上面的示例中，我们使用 .myClass 来选择 class 为 myClass 的元素，并为其设置了灰色背景和 10px 的内边距。

需要注意的是，class 选择器的优先级低于 id 选择器，但是高于元素选择器。因此，如果同时使用了 id 和 class 选择器，id 选择器的样式会优先生效。

通过合理地使用 id 和 class，我们可以更加灵活地为网页中的元素添加样式，实现更加丰富多彩的界面效果。