代码
<style> div { width:100px; height:100px; background:green; position: relative; } div:before{ content:''; position:absolute; top:-5px; bottom:-5px; right: -5px; left: -5px; border: 5px solid #ff0088; animation:myfirst 5s linear infinite; /* Safari and Chrome */ } @keyframes myfirst { 0%,100%{clip: rect(0px,110px,5px,0px);} 25%{clip: rect(0px,110px,110px,105px);} 50%{clip: rect(105px,110px,110px,0px);} 75%{clip: rect(0px,5px,110px,0px);} } </style> </head> <body> <p><b>注意:</b> 该实例在 Internet Explorer 9 及更早 IE 版本是无效的。</p> <div></div> </body>
效果图片：