更改边框宽度

Question

所以我最近搜索了很多，却找不到答案。如何更改边框底部的宽度，就像我想让它从左到右5倍一样，如何？我试着在这里观看youtube视频和所有的图片描述

正如你在图片中看到的，边框底部的宽度不是文本的100%

Answer 1

这里有一个使用背景宽度绘制假边框的好效果。你可以很好地发挥大小，颜色宽度等

a {
font-size: 20px;
text-decoration: none;
background-size: 0 1px;
background-repeat: no-repeat;
background-position: 0 100%;
transition: background-size .5s ease-out;
background-image: linear-gradient(to bottom, transparent 20%, currentColor 21%);
}
a:hover {
background-size: 100% 1px;
}

<a href="#">Hover me with your mouse</a>