CSS语法差异

Question

这两个陈述之间有什么区别？

a.class { color: red; }

和

.class a { color: red; }

我认为在第二个例子中，人们可以选择“内部”类，如

.class .class2 a { color: orange; }

但你不能用第一个例子

来做到这一点

Answer 1

a.class将选择a元素.class，.class a将选择具有类a的元素内的所有.class元素。< / p>

关于此.class .class2 a { color: orange; }

它将在具有类a的元素中选择所有.class2元素，该元素进一步嵌套在具有类.class的元素中

Answer 2

对于第一个类，所有带有类类的＆lt; a＆gt;都将根据样式设置样式。

对于第二个类，具有类类的元素中的所有＆lt; a＆gt;将根据样式设置样式。

Answer 3

a.class {color: red}将为类.class红色的任何锚标记着色。它只会影响具有该指定类的锚标记，因为a和.class元素之间没有空格。

.class a { color: red; }会将父.class元素中的任何锚标记着色为红色。元素之间的空间这次声明了层次结构，要求achor标记在.class元素内。