Question

我设计了一个门户网站，我无法更改任何HTML但是CSS并且遇到了以下一些代码，我想要定位第一个标签（您的名字）。

<form class="no-tables" name="" action="" method="post">
    <div>
        <input type="hidden" name="" value="1">
        <label>Your Name</label>
        <label>Your Age</label>
    </div>
</form>

我尝试了雪佛龙和第一胎选择器，但似乎都没有。

Answer 1

尝试使用first-of-type：

/* CSS3 */
form.no-tables > div > label:first-of-type {
  background: red;
}

/* or with CSS2 */
form.no-tables > div > input + label {
  border: 1px solid black;
}

<form class="no-tables" name="" action="" method="post">
  <div>
    <input type="hidden" name="" value="1">
    <label>Your Name</label>
    <label>Your Age</label>
  </div>
</form>

Answer 2

您可以仅使用input + label for CSS2来执行此操作。

编辑所以 fcalderan 已经提到了这一点。

＆＃13;

input + label {
  background-color: blue;
}

＆＃13;

<form class="no-tables" name="" action="" method="post">
    <div>
        <input type="hidden" name="" value="1">
        <label>Your Name</label>
        <label>Your Age</label>
    </div>
</form>

＆＃13;

使用CSS定位第一个标签

2 个答案: