css 中 first-of-type 与 first-child 的区别

文章目录

    举个直观的例子:

    <div class="main">
      <h1>Languages</h1>   <!-- h1:first-child, h1:first-of-type -->
      <div>Javascript</div>   <!-- div:nth-child(2), div:first-of-type -->
      <div>Golang</div>
      <div>PHP</div>
    </div>
    
    • first-child 是指父节点下的第一个元素,无论类型是什么
    • first-of-type 不一定是父节点下的第一个元素,但是是第一个指定类型的元素

    例如:

    <div>Javascript</div>
    

    是 div:first-of-type,但是不是 div:first-child.

    关于作者 🌱

    我是来自山东烟台的一名开发者,有感兴趣的话题,或者软件开发需求,欢迎加微信 zhongwei 聊聊,或者关注我的个人公众号“大象工具”, 查看更多联系方式