相关疑难解决方法(0)

我有一堆带有类名的元素red,但我似乎无法class="red"使用以下CSS规则选择第一个元素:

.red:first-child {
    border: 5px solid red;
}

<p class="red"></p>
<div class="red"></div>

这个选择器有什么问题,我该如何纠正？

感谢这些评论,我发现该元素必须是其父母的第一个孩子才能被选中,这与我的情况不同.我有以下结构,这条规则失败,如评论中所述:

.home .red:first-child {
    border: 1px solid red;
}

<div class="home">
    <span>blah</span>
    <p class="red">first</p>
    <p class="red">second</p>
    <p class="red">third</p>
    <p class="red">fourth</p>
</div>

我怎样才能让第一个孩子上课red？

使用 Chrome 开发工具

jQuery('.proejct-text-field')

给我四个 HTML 元素实例：

<div class=".proejct-text-field ...">...<>
<div class=".proejct-text-field ...">...<>
<div class=".proejct-text-field ...">...<>
<div class=".proejct-text-field ...">...<>

尝试以下不会返回任何元素。

jQuery('.proejct-text-field:nth-of-type(1)')

至于我的理解，应该返回第一个元素。我只是使用 jQuery 来为我的目的找到正确的选择器并将它们放入我的 css 文件中。那么如何选择这些 Div 的第一个 Elment。顺便说一句：它们没有被包装到某个父元素中。所以任何子方法都不起作用。此外，div 的数量是可变的。