css如何调整红心样式_css3实现的红心跳动效果
生活随笔
收集整理的這篇文章主要介紹了
css如何调整红心样式_css3实现的红心跳动效果
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
[HTML] 純文本查看 復(fù)制代碼
螞蟻部落.box {
width: 180px;
height: 160px;
margin: 200px auto;
position: relative;
animation: shan .6s infinite alternate;
text-align: center;
-webkit-animation: shan .6s infinite alternate;
}
@-webkit-keyframes shan {
0% {
opacity: 0.5;
-webkit-transform: scale(0.8,0.8);
transform: scale(0.8,0.8);
}
}
.box span {
display: inline-block;
background: #f06a73;
position: absolute;
}
.box_lt, .box_rt {
width: 100px;
height: 100px;
border-radius: 50%;
}
.box_lt {
left: 0;
top: 0;
}
.box_rt {
left: 80px;
top: 0;
}
.box_ft {
width: 100px;
height: 100px;
-webkit-transform: rotate(135deg);
left: 40px;
top: 40px;
}
總結(jié)
以上是生活随笔為你收集整理的css如何调整红心样式_css3实现的红心跳动效果的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 联发科mtk和骁龙730哪个好_天玑72
- 下一篇： render在python中的含义_py