0

我想知道为什么某些 css 文件使用 div.border 而不是 .border 来列出 CSS 中的扇区。我已经看到它用于多个部门，div.footer {color:#000000;}而不仅仅是.footer {color:#000000;}

谢谢你的帮助。

4

5 回答 5

2

您可能要指定元素的原因有 3 个：

  1. 您正在将该类应用于多种类型的元素，并且需要添加或覆盖特定元素的规则。

  2. 您希望在样式表中提供上下文信息（通常用于其他开发人员）

  3. 您需要额外的特异性来覆盖另一个类的样式规则。

一般来说，我认为＃1是一个坏主意，除了一些实用程序类（如浮动或清除），我认为使用像 Saas 这样的预处理器和 mixins 可以更好地处理这种事情

我认为第二种情况的价值值得怀疑。如果遇到第三种情况（很像 sprinkling in !important），您可能需要重构一些东西以避免不得不这样做。无论如何请注意，如果不需要它们，将元素添加到选择器只会减慢匹配速度

于 2012-06-25T22:18:30.907 回答
1

点前出现“div”意味着选择器仅适用于 div 类型的 DOM 元素。

因此，例如，如果您有一个名为“foo”的类，

.foo {
    color:#ff0000;
}

它会使里面的文字变成红色。使用 div.foo 将导致指令仅适用于该类的 div。

于 2012-06-25T22:11:09.350 回答
1

<div class="border">Div with border</div>考虑和之间的区别<p class="border">Paragraph with border</p>。的样式.border { ... }会影响这两者，而div.border{ ... }只会影响 div。

于 2012-06-25T22:13:30.423 回答
1

如果您希望编写的 .border 类规则仅适用于 div 容器，而不是表容器或其他元素，那么您就是这样做的。有很多关于 CSS 选择器的好文章，这只是一篇。

于 2012-06-25T22:15:54.043 回答
1

如前所述，将 div 元素添加到 footer 类将确保样式仅应用于具有类“footer”的 div，而不应用于具有类“footer”的其他元素。

理想情况下，如果您确定您只会在一个特定的 DOM 元素上使用该类，那么您将只使用 .footer。在类前面添加 DOM 元素不是必需的，并且会对渲染性能产生负面影响（好吧，实际上它没有太大影响，但仍然效率低下）。

于 2012-06-25T22:24:55.967 回答