为什么这个CSS:第一个孩子选择器工作?

前端之家收集整理的这篇文章主要介绍了为什么这个CSS:第一个孩子选择器工作?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在开发一个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;
}

所有我想做的是使字段集中的第一个div的边距为0.我认为选择器字段集> div:第一个孩子会将样式应用于“一个字段集的第一个孩子,其类型是一个div”,但是显然有些东西正在逃避我。

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

谢谢。

解决方法

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

这不意味着“选择字段集中的第一个div”。

这种情况下的第一个孩子是< input type =“hidden”value =“2”>。

要在不更改HTML的情况下选择该div,您需要使用字段集> DIV:首个类型。

不幸的是,:first-child被广泛支持:first-of-type只适用于IE9和其他现代浏览器。

所以,在这种情况下,最好的修复是继续使用字段集> div:first-child,并简单地移动< input type =“hidden”value =“2”>所以这不是第一个孩子。

原文链接:https://www.f2er.com/css/218680.html

猜你在找的CSS相关文章