CSS选择器中有多个类

前端之家收集整理的这篇文章主要介绍了CSS选择器中有多个类前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我看到一个这样的选择器,
.class1 .class2 .class3 {
}

这是什么意思?

我使用了多个没有空格的类选择器。空间意味着后代,但它对于类没有意义。

解决方法

假设有一个具有以下标记页面
<div class="class1">
  <div class="class2">
    <div class="class3">
      Some page element(s).
    </div>
  </div>
</div>

您提供的CSS将为class3下的所有元素设置样式,这些元素在class2下,属于class1。

让我们说这是造型,

.class1 .class2 .class3{
  color:red;
}

它会将文本渲染为红色,这相当于以下内容

div.class1 div.class2 div.class3 {
  color:red;
}

最后,下面什么也不做,

.class1.class2.class3{
  color:red;
}

编辑:如果标记改为以下,

<div class="class1 class2 class3">
      Some page element(s).
</div>

它会工作和渲染的文本为红色。

注意: IE7可能有上述问题…

http://www.thunderguy.com/semicolon/2005/05/16/multiple-class-selectors-in-internet-explorer/
http://www.w3.org/TR/2004/CR-CSS21-20040225/selector.html#class-html

猜你在找的CSS相关文章