为什么这个 CSS :first-child 选择器不起作用？

发布于 2024-12-07 12:02:51 字数 684 浏览 1 评论 0原文

我正在开发一个 Asp.Net MVC 3 项目，但对于为什么它不能像我想象的那样工作而陷入困境。

我的标记是：

<fieldset>
    <input type="hidden" value="2">
    <div class="editor-label"> 
        <label for="Name"> Name</label>
    </div>
    ...
</fieldset>

我的CSS是：

.display-label, .editor-label
{
    margin: 0.8em 0 0 0;
    font-weight: bold;
    display: inline;
}

fieldset > div:first-child
{
    margin: 0;
}

我想做的就是使fieldset中的第一个div的边距为0。我认为选择器 fieldset > > div:first-child 会将样式应用于“字段集的第一个子级，其类型是 div”，但显然有些东西在躲避我。

我已经在 IE9/FF/Chrome 中尝试过这个，所以它不是一个旧的浏览器扰乱我的选择器。

谢谢。

原文

I'm working on an Asp.Net MVC 3 project and have run into a brick wall on why this doesn't work like I think it should.

My markup is:

<fieldset>
    <input type="hidden" value="2">
    <div class="editor-label"> 
        <label for="Name"> Name</label>
    </div>
    ...
</fieldset>

My css is:

.display-label, .editor-label
{
    margin: 0.8em 0 0 0;
    font-weight: bold;
    display: inline;
}

fieldset > div:first-child
{
    margin: 0;
}

All I want to do is make the first div in the fieldset have a margin of 0. I thought that the selector fieldset > div:first-child would apply the style to "the first child of a fieldset, whose type is a div", but apparently something is eluding me.

I've tried this in IE9/FF/Chrome so it's not an old browser messing with my selectors.

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

长发绾君心 2024-12-14 12:02:51

字段集> div:first-child 表示“选择 fieldset 的第一个子元素如果它是 div”。

它并不意味着“选择 fieldset 中的第一个 div”。

本例中的第一个子级是。

要选择该 div 而不更改 HTML，您需要使用 fieldset > div:第一个类型。

不幸的是，虽然 :first-child 得到了广泛支持，< a href="http://reference.sitepoint.com/css/pseudoclass-firstoftype" rel="noreferrer">:first-of-type 仅适用于 IE9+ 和其他现代浏览器浏览器。

因此，在这种情况下，最好的解决方法是继续使用 fieldset > div:first-child，然后简单地移动这样它就不是第一个孩子了。