添加分隔符|的几种方法

最新推荐文章于 2024-12-26 01:15:45 发布

原创

最新推荐文章于 2024-12-26 01:15:45 发布 · 2k 阅读

·

0

·

本文介绍了如何利用CSS为HTML中的链接<a>元素添加分隔线，包括两种常见方法：插入额外的<span>标签和使用伪类选择器如`:last-child:after`。特别地，通过调整CSS样式，可以实现高度一致的分隔线效果，增强页面视觉效果。文章还强调了选择器顺序的重要性，确保最后一个链接不会显示分隔线。

要给每个a标签(除了最后一个)后面添加分隔线| ，可以这样做：
在这里插入图片描述

方法一：在每个a后面加上span标签

在这里插入图片描述

方法二：使用伪类：

在这里插入图片描述
注意：最后一个伪类不想要可以这样：

&:last-child:after{
   
   
        display: none;
      }

一定要注意顺序，是&:last-child:after，不是&:after:last-child

标签

#css #html

最低0.47元/天解锁文章

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。