Question

我有这个构成：

<div class="theclass1"> 
     <input type="checkbox" id ="1">
     <div>
        <div>
          <div>
          <label for="1">bla bla</label>
          </div>
        </div>
        <input type="checkbox" id ="yy">
        <label for ="yy">other</label>
     </div>

  <div class="theclass2">  
    <input type="checkbox" id ="2">
    <div>
      <div>
         <div> 
         <label for="2">bla bla</label>
        </div>
      </div>
        <input type="checkbox" id ="xx">
        <label for ="xx">other</label>
    </div>  
  </div>

</div>

我希望（并且我是超级委托）将css样式应用于标签，但只是第一个'theclass1'

我正在玩第一个类型，第一个孩子，+ div＆gt; div＆gt; div等...但没有成功。

也许有人可以解释我如何制作这个以及如果可能的话使用一些例子。我有很多麻烦要理解空间的含义，+和＆gt;选择。另外......我认为它可以有多个解决方案？

我需要代码才能设置样式1的第一个标签，或者第一个内部＆gt; div＆gt; div＆gt; div，但只有这一个。类似于类2的东西。现在我有一个污染的CSS和不良结果。

（div'theclass2'在div theclass1里面。）

提前致谢。

Answer 1

问题不仅仅是CSS，HTML中存在严重的语义错误

id属性名称不得以数字开头

取自w3c的HTML4文件

ID和NAME令牌必须以字母（[A-Za-z]）开头，可能是后跟任意数量的字母，数字（[0-9]），连字符（＆＃34; - ＆＃34;），下划线（＆＃34; _＆＃34;），冒号（＆＃34;：＆＃34;）和句号（＆＃34;。＆＃34;）。

这么多嵌套，为什么这些额外的父div div和div？
现在首先修复HTML节点，然后在css下面应用

如果您只想要第一个div类的第一个标签

 .theclass1:first-child > label:first-of-type

working DEMO

Answer 2

.theclass1 > div:first-of-type > div > div > label {
    color: red;
}

http://jsfiddle.net/807t5L6z/

Answer 3

.theclass1 label:first-child {
color:red;
}

你可以在.theclass2

中使用这个类似的标签代码

Answer 4

一般的答案是“HTML中的全球第一个标签”无法完成，请参见此处：CSS global :nth-of-type selector (:nth-of-class)

最好为此标签引入class或id。

但是，如果要在不修改HTML的情况下定位它，可以使用此选择器：

label[for='1'] {
    background:red
}

Answer 5

 .theclass1 > div > div > div label {color:red;}

Css选择器需要帮助

5 个答案: