思路: 一个外层盒子设置背景;一个内层盒子设置宽高背景,并设置animate让盒子移动
demo:
css部分:
@keyframes mymove {
from{left:0px
;}
to{left:70px
;}
}
.father{
background: #748096
;
border-radius:5px
;
position: relative
;
top: 70px
;
left: -5px
;
}
.moveson {
width:20px
;
height:8px
;
background:#a0e80c
;
border-radius: 5px
;
animation:mymove 2s linear infinite
;
position:relative
;
}
html部分:
<div
class="father">
<div
class="moveson"></div
>
</ediv
>