如何使用html和css绘制虚线

如何使用html和css绘制虚线，如下所示。不是虚线

“-------------------------------------------------------------”

可以使用此边框：1px虚线。 但是需要增加破折号的长度大小。而不是宽度使用，并且您可以根据需要控制大小和间距：

.line{
保证金：5px0；
高度：2倍；
背景：
重复线性渐变（向右，红色0，红色5px，透明5px，透明7px）
/*5px红色，然后2px透明->重复此操作*/
}
.line1{
保证金：5px0；
高度：2倍；
背景：
重复线性渐变（向右，红色0，红色3px，透明3px，透明7px）
/*3个红色然后4个透明->重复这个*/
}
.line2{
保证金：5px0；
高度：2倍；
背景：
重复线性渐变（向右，红色0，红色10px，透明10px，透明12px）
/*10px红色然后2px透明->重复此操作*/
}

这条线是这样画的。我想在下面这样的后面附加箭头..--------------------------------------------->。但使用无法创建的上方线条。@SSSS调整回位位置。。。正如你在5月最后一个代码中看到的，高度是20px，中间有一个梯度。因此，调整您想要的高度，并将渐变放置在中间。这是使用的箭头。fa ui图标键盘右箭头