html – :第一个子选择器不工作
发布时间:2020-12-14 18:52:07 所属栏目:资源 来源:网络整理
导读:我正在选择具有:first-child和:last-child伪选择器的特定div,但是:first-child在我检查过的任何浏览器中都不起作用.我已经检查了caniuse.com和css-tricks.com以及共识是:第一个孩子得到了广泛的支持,所以我想也许有一些我不知道的错误.我在本地节点服务
我正在选择具有:first-child和:last-child伪选择器的特定div,但是:first-child在我检查过的任何浏览器中都不起作用.我已经检查了caniuse.com和css-tricks.com以及共识是:第一个孩子得到了广泛的支持,所以我想也许有一些我不知道的错误.我在本地节点服务器上运行应用程序.我已经验证了我的CSS和我的
HTML.是否有人知道任何可能阻止的错误:第一个孩子工作?
HTML <div class="col-md-6 blurbs"> <label>NEWS</label> <div> <p>Lorem ipsum dolor spernatur aut odit aut fugit conse oluptate</p> </div> <div class="clearfix"> <a class="pull-left">RSS</a> <a class="pull-right">MORE NEWS</a> </div> </div> CSS (不工作) .news .blurbs div:first-child{ outline: 1px solid red; height: 260px; overflow: auto; margin-bottom: 10px; } (工作) .news .blurbs div:last-child{ outline: 1px solid red; width: 95%; } 解决方法
:first-child和:last-child伪类选择父元素的第一个/最后一个子元素,由任何其他链式选择器过滤,因此div:first-child实际上不匹配任何内容作为第一个子元素.blurbs不是div.
你需要用什么来获得你想要的效果是:first-of-type伪类,如下所示: .news .blurbs div:first-of-type{ outline: 1px solid red; height: 260px; overflow: auto; margin-bottom: 10px; } here is a working example (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |