时间戳

首页 > 解决方案 > 为什么这个 CSS 规则中只使用了类属性值的一部分？

html - 为什么这个 CSS 规则中只使用了类属性值的一部分？

问题描述

在 html 正文标签中：

<div class="clock">
  <div class="clock-face">
    <div class="hand hour-hand"></div>
    <div class="hand min-hand"></div>
    <div class="hand second-hand"></div>
  </div>
</div>

在 CSS 文件中：

.hand {
  <!--Some CSS Code-->
}

现在我想知道为什么不使用全类值（手时针）？

标签： htmlcss

解决方案

div 元素

<div class="hand hour-hand"></div>

有一个class属性，该属性包含在两个字符串的空格分隔列表中：hand和hour-hand. 空间是为了将它们分开。

使用 CSS 选择器，您可以通过以下方式通过类属性值选择该 div 元素：

.hand {
  ...styling
}

或者

.hour-hand {
  ...styling
}

在您的示例中，通过使用，.hour-hand您只选择了下面的第一项，lock-face因为此类仅存在于那里。通过使用：.hand您正在选择具有 class 属性的 3 个 div 项hand。

我的建议是在此处阅读有关 CSS 选择器的更多信息

推荐阅读