这是一款纯CSS3编写的黑色的磁带转动播放动画特效,比较适合个性网站的朋友们,在网上中添加这样的效果比较好。
CSS样式
在页面引入以下style.css代码
<link rel="stylesheet" href="css/style.css">
Html结构
在页面引入以下Html代码
<div class="container"> <div class="mixtape-container"> <div class="mixtape-inner"> <div class="mixtape-inner-middle"> <div class="mixtape-inner-tape"> <div class="mixtape-inner-tape-ring"> <span></span><span></span><span></span><span></span><span></span> </div> </div> <div class="mixtape-inner-tape"> <div class="mixtape-inner-tape-ring"> <span></span><span></span><span></span><span></span><span></span> </div> </div> </div> </div> <div class="mixtape-bottom"> <div class="mixtape-bottom-circle"></div> <div class="mixtape-bottom-circle"></div> <div class="mixtape-bottom-circle"></div> <div class="mixtape-bottom-circle"></div> </div> <div class="mixtape-detail"> <div class="screw"></div> <div class="screw"></div> <div class="screw"></div> <div class="screw"></div> <span class="tape-hole"></span><span class="tape-hole"></span><span class="tape-hole"></span> </div> </div> </div>