利用CSS3实现雷达扫描效果图特效
阿里西西web开发网为大家整理了这篇利用CSS3实现雷达扫描效果图动画特效，如果这篇文章在您的工作或学习中有帮助，欢迎常回来看看哦，更多精彩的教程请访问我们的主页,以下是教程浏览：
脚本代码(For )如下:
round
.round {
border: 1px solid rgba(255, 255, 255, 0.5);
margin: 50px auto;
}
.w300 {
border-radius: 298px;
height: 298px;
margin-top: 0;
overflow: hidden;
width: 298px;
}
.w200 {
border-radius: 200px;
height: 200px;
width: 200px;
}
.w100 {
border-radius: 100px;
height: 100px;
width: 100px;
}
.w1 {
background-color: #fff;
border-radius: 1px;
height: 1px;
position: relative;
top: -4px;
width: 1px;
}
.line {
background: rgba(0, 0, 0, 0) -moz-linear-gradient(center top , rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5)) repeat scroll 0 0;
border-left: 1px solid rgba(255, 255, 255, 0.6);
border-radius: 0 0 150px;
height: 150px;
left: 0;
position: absolute;
top: 0;
transform: rotate(0deg);
transform-origin: 0 0 0;
width: 150px;
}
.roundMove {
animation: 3s linear 0s normal both infinite running round;
}
@keyframes round {
100% {
transform: rotate(360deg);
}
}
@keyframes round {
100% {
transform: rotate(360deg);
}
}
关于利用CSS3实现雷达扫描效果图动画特效的内容写到这里就结束啦，您可以收藏本页网址/js/a/090295253.shtml方便下次再访问哦。
