css border 虚线画法

众所周知,border的虚线是固定宽度,如果需要一个不限制宽度,可用repeating-linear-gradient画法

.divider--dashed {
  // border: dashed;
  border-width: thin;
  // border-color: #e6eaf2;
  border-image: repeating-linear-gradient(
      to right,
      #e6eaf2 0px,
      #e6eaf2 8px,
      transparent 8px,
      transparent 15px
    )
    1 repeat !important;
}

用法

<v-divider class="divider--dashed">v-divider>

你可能感兴趣的:(css,前端)