1. 犀牛前端部落首页
  2. 未分类

CSS :last-child 选择器选择指定class最后一个元素,为什么不对?

写css的时候,经常需要选择一个类型的最后一个子元素,新手经常写成:last-child。

而:last-child所指的是元素是容器的最后一个子元素,而不是特定类型的元素的最后一个子元素时才有效。

我们可以使用:last-of-type来解决这个问题last-of-type

代码如下:

html

<div class="commentList">
    <article class="comment " id="com21"></article>

    <article class="comment " id="com20"></article>

    <article class="comment " id="com19"></article>

    <div class="something"> hello </div>
</div>

css

body {
    background: black;
}

.comment {
    width:470px;
    border-bottom:1px dotted #f0f0f0;
    margin-bottom:10px;
}

.comment:last-of-type {
    border-bottom:none;
    margin-bottom:0;
}

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/784.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注