为什么人们只在.border的css文件中使用div.border？

Question

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

谢谢你的帮助。

Answer 1

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

1. 您正在将类应用于多种类型的元素，并且需要添加或覆盖特定元素的规则。如果您希望在样式表中提供上下文信息(通常对于其他developers)
2. You，您需要额外的专用性来覆盖另一个类中的样式规则
3. )。

总的来说，我认为#1是一个糟糕的主意，除了一些实用类(比如浮点或清除)，我认为这类事情最好使用预处理器，比如带有mixins的Saas

我认为第二种情况的价值值得怀疑。如果您遇到第三种情况(非常类似于在!important中撒水)，您可能希望重构以避免不得不这样做。在任何情况下，请注意，如果不需要它们，则向选择器添加元素只会减慢匹配速度

Answer 2

在点之前出现" div“意味着选择器只适用于div类型的DOM元素。

举个例子，如果你有一个叫做"foo“的类，

.foo {
    color:#ff0000;
}

这将使文本内部变为红色。使用div.foo将导致指令仅应用于该类的div。

Answer 3

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