html – 不申请:last-child to article

我有以下标记

<div>
  <article>article 1</article>
  <article>article 2</article>
  <article>article 3</article>
  <article>article 4</article>
  <ul class="pagination">
    <li>Page 1</li>
    <li>Page 2</li>
  </ul>
</div>

我尝试对每篇文章应用底部边框,但不对最后一篇应用:

article:not(:last-child) {
  border-bottom: 8px solid #404040;
}

但是有了这个,我在上一篇文章中得到了一个边框.

如果我删除UL,那么上一篇文章没有边框.

这很奇怪,因为我只是将风格应用于文章.

我怎么解决这个问题?

谢谢,
米格尔

解决方法

它应该是 last-of-type而不是last-child.

article:not(:last-of-type) {
  border-bottom: 8px solid #404040;
}

DEMO here.

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些