为了账号安全,请及时绑定邮箱和手机立即绑定

:第一个孩子不能按预期工作

:第一个孩子不能按预期工作

函数式编程 2019-09-24 16:28:58
我试图选择一个名为的类中的第h1一个。如果它是其中的第一个元素,它会起作用,但是如果在它之后出现,它将不起作用。divdetail_containerh1divul<style type="text/css">.detail_container h1:first-child{color:blue;} </style></head><body><div class="detail_container">    <ul>    <li></li>    <li></li>    </ul>    <h1>First H1</h1>    <h1>Second H1</h1></div></body></html>我的印象是,h1无论它在哪里,我拥有的CSS都会选择第一个div。我该如何运作?
查看完整描述

3 回答

?
qq_花开花谢_0

TA贡献1835条经验 获得超6个赞

该h1:first-child选择装置



当且仅当它是一个h1元素时,才选择其父项的第一个孩子。


所述:first-child容器的这里是ul,这样不能满足h1:first-child。


:first-of-type您的情况有CSS3 :


.detail_container h1:first-of-type

{

    color: blue;

但是由于浏览器兼容性问题而已,那么最好还是给第h1一个类一个类,然后再定位该类:


.detail_container h1.first

{

    color: blue;

}


查看完整回答
反对 回复 2019-09-24
?
人到中年有点甜

TA贡献1895条经验 获得超7个赞

对于这种特定情况,您可以使用:


.detail_container > ul + h1{ 

    color: blue; 

}

但是,如果在许多情况下都需要相同的选择器,则应该为这些选择器提供一个类,如BoltClock所说。


查看完整回答
反对 回复 2019-09-24
  • 3 回答
  • 0 关注
  • 511 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信