border的虚线间隔如何实现

border设置边框虚线大家都会

例如：

border:dashed 1px #000

但是我们设置出来的边框虚线间距却控制不了，那么有没有办法让我们的虚线间距可以控制呢，答案是肯定的，今天我们就来用渐变来实现边框的间距

先看下效果：

上面的边框虚线就是我们用css渐变写出来了，下面来分析代码：

<div class="dashed"></div>
.dashed {
    height: 1px;
    background: linear-gradient(to right, #000000, #000000 15px, transparent 15px, transparent);
    background-size: 30px 100%;
}

我们要改变边框的间隔只需要控制linear-gradient第二个参数和第三个参数，而这两个参数的值加起来等于background-size的宽度值