CSS 中"."和"#"选择器的区别

"."选择器

"."选择器是类级选择器。点运算符用于创建样式类，然后可将其应用于多个 HTML 元素。

"#"选择器

"#"选择器是元素级选择器。哈希运算符用于将样式应用于 ID 与"#"选择器中使用的 ID 相同的特定元素。

示例

以下示例展示了在三个 div 元素上使用"."和"#"选择器的方法。

<!DOCTYPE html>
<html>
<head>
   <title>Selector Example>/title>
   <style>
      .blackBorder {
         border: 2px solid black;
      }
      #redDiv {
         border: 2px solid red;
      }
   </style>
</head>
<body>
   <div> No Border Box </div>
   <div class="blackBorder"> Black Border Box </div>
   <div id="redDiv"> Red Border Box </div>
   <div> No Border Box </div>
   <div class="blackBorder"> Black Border Box </div>
</body>
</html>

相关文章

• 使用 CSS Animation 为 transform 属性添加动画
• CSS word-spacing 属性动画
• CSS width 属性动画
• CSS outline-color 动画
• CSS text-decoration-color 属性动画
• 在 CSS perspective-origin 属性上执行动画
• CSS text-shadow 属性动画
• CSS text-indent 属性动画
• CSS top 属性动画
• CSS outline-offset 属性动画

有用资源

• css 参考教程 - 该教程包含有关 css 的更多信息:https://www.cainiaomax.com/css/