还是利用渐变来实现的，我们废话不多说，直接上代码：
width: 200px;
height: 80px;
border-color: transparent;
background: linear-gradient(#fff,#fff) padding-box,
repeating-linear-gradient(-45deg,red 0,red 12.5%,transparent 0,transparent 25%,blue 0, blue 37.5%,transparent 0,transparent 50%) 0/30px 30px;效果如下：
利用同样的原理，我们来实现蚂蚁行军边框：
.grad-07{
width: 300px;
height: 200px;
border: 1px solid transparent;
background: linear-gradient(#fff,#fff) padding-box,
repeating-linear-gradient(-45deg,#000 0,#000 25%,transparent 0,transparent 50%) 0/30px 30px;
animation: ants 12s linear infinite;
}
@keyframes ants{
to{background-position: 100%;}
}