无法定位元素的最后一个子元素

Question

我想在while循环中禁用最后一个elemnt的border-bottom,但它不起作用......这是代码:

<div class="col-sm-4">  
        <?php if ( $the_query->have_posts() ): ?>
        <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>                                   
          <h2 class="special-project-title"><?php the_title()?></h2> <br/>
         <div class="post-meta special-project-meta"><?php mida_post_meta()?></div><br/>
         <a class="more-link spaciel-project-more" href="<?php echo the_permalink() ?>"><?php echo __('Read More', 'mida')?></a><br/>
    <?php endwhile; endif;?>    
    <?php wp_reset_query(); ?>  
</div>

"spaciel-project-more"有一个边框底部,但我希望最后一个没有边框底部..无法想出这个...

CSS:

.spaciel-project-more{
    border-bottom: 1px solid black;
    margin-top: -15px;
    margin-bottom: -15px;
    padding-bottom: 15px;
}
.spaciel-project-more:last-child{
    border-bottom:none;
}

提前致谢!

Answer 1

这不是:last-child因为之后还有其他一些内容.你可以使用:last-of-type:

.spaciel-project-more:last-of-type {
  border-bottom: 0
}

演示:JSFiddle