最近在开发项目,针对小程序前端,显示文本需要添加下划线问题,起初是通过border-bottom:1rpx solid #eee; 进行编写,但是总是觉得线的高度过于粗,移动端最小单位值是 1 即:1rpx 1px,高度设置0.3是不生效的,后面看到相关博客通过 scale进行划线,在这记录下:
<div class="line-bottom"> zty </div>
.line-bottom{ position:relative; } .line-bottom:after{ content:" "; position:absolute; left:0; bottom:0; width:100%; height:1px; transform:scaleY(.5); background-color:#eeeeee; }

在小程序前端开发中,为解决文本下划线过粗的问题,本文介绍了一种使用CSS transform属性scaleY来实现更细下划线的方法,适用于需要精细控制线高和宽度的场景。
1822

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



