html – 不申请:last-child to article

html – 不申请:last-child to article,第1张

概述我有以下标记 <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</l 我有以下标记

<div>  <article>article 1</article>  <article>article 2</article>  <article>article 3</article>  <article>article 4</article>  <ul >    <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.

总结

以上是内存溢出为你收集整理的html – 不申请:last-child to article全部内容,希望文章能够帮你解决html – 不申请:last-child to article所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1068008.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-26
下一篇 2022-05-26

发表评论

登录后才能评论

评论列表(0条)

保存