使用css制作出一个可以随意调节间距的边框

众所周知，ui设计一般是不懂css的，也就是说他们设计出来的页面可能会有些细节是原生的css语言无法做到的，就比如原生的css边框虚线之间的间距比较小，无法控制，这个时候就需要我们换个思路来操作了。

这里我们使用线性背景来制作该效果；

width: 4rpx;
height: 80rpx;
background-image: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 50%, transparent 50%);
background-size: 4rpx 18rpx;
background-repeat: repeat-y;

background-image: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 50%, transparent 50%);

用来控制画出来的边框的颜色
background-size: 4rpx 18rpx;

用来控制画出来的边框的宽度和间距
background-repeat: repeat-y;

用来控制画出来的边框的方向是水平还是垂直