css 虚线动画

可以使用 CSS 的 animation 和 border 属性来实现虚线动画。

首先，需要设置元素的 border 样式为虚线，例如：

border: 1px dashed #000;

然后，使用 animation 属性来定义动画效果。可以设置 border-dashoffset 属性来控制虚线的偏移量，从而实现虚线动画。例如：

@keyframes dash {
  to {
    border-dashoffset: 4px;
  }
}

.dashed {
  animation: dash 1s linear infinite;
}

以上代码表示，在 1 秒钟内，虚线将以线性方式不断地向右偏移 4px。同时，使用 infinite 参数来让动画无限循环。

完整的代码示例如下：

<div class="box dashed"></div>

.box {
  width: 200px;
  height: 100px;
  border: 1px solid #000;
}

.dashed {
  border: 1px dashed #000;
  animation: dash 1s linear infinite;
}

@keyframes dash {
  to {
    border-dashoffset: 4px;
  }
}