css - 如何控制破折号到边框的长度而不使用仅带有 css 的图像？

Question

我需要更改边框底部的破折号长度。我想让每个破折号的长度为 30px。有没有机会在不使用任何图像的情况下做到这一点？

Answer 1

没有任何图像是不可能的。但它可以在不加载任何图像的情况下完成——使用 CSS 渐变（基本上是生成的图像）​​：

background: linear-gradient(to right, currentColor 0%, currentColor 50%, transparent 50%, transparent 100%) repeat-x left bottom;    
background-size: 60px 1px;