/*-----背景-----*/
.box {
width:200px;
height:100px;
background:repeating-linear-gradient(30deg,#79b,#79b 15px,#58a 0,#58a 30px);
}
/*-----边框-----*/
@keyframes line {
to {
background-position:100%;
}
}.box1 {
width:200px;
height:100px;
padding:1em;
border:1px solid transparent;
background:linear-gradient(white,white) padding-box,repeating-linear-gradient(
-45deg,black 0,black 25%,white 0,white 50%
) 0 / .6em .6em;
animation:line 12s linear infinite;
}
此效果运用css3的渐变效果来实现的