css自定义虚线

自定义虚线 用过渡的方法

横线

	  width: 100%;
      height: 1px;
      background-image: linear-gradient(
        to right,
        #d8d8d8 0%,
        #d8d8d8 50%,
        transparent 50%
      );
      //控制虚线大小
      background-size: 16px 1px;
      background-repeat: repeat-x;

效果

竖线

.dotCss {
  width: 1px;
  height: 100%;
  background-image: linear-gradient(
    to bottom,
    #f21212 0%,
    #e21313 50%,
    transparent 50%
  );
  background-size: 1px 16px;
  background-repeat: repeat-y;
}