* {
margin:0;
padding:0;
}
body {
background:rgb(55,76,86);
}
.photo {
width:240px;
height:240px;
margin:100px auto;
font-family:"微软雅黑";
padding:5px;
border-radius:20px;
box-shadow:0 0 7px#fff;
overflow:hidden;
}
.title {
width:240px;
height:30px;
/*background:url("images/2.png")no-repeat;
*/
font-size:20px;
color:#ccc;
font-weight:bold;
text-align:center;
line-height:30px;
}
.play {
width:80px;
height:80px;
background:url("http://p1.music.126.net/lN2jt4Vkqw3zzIjc2JjyCw==/2532175280981641.jpg?param=130y130")no-repeat;
margin:auto;
border-radius:50% 50%;
cursor:pointer;
}
.lrc {
width:200px;
height:100px;
margin:20px auto;
text-align:center;
font-size:10px;
overflow:hidden;
color:#ccc;
}
.words {
position:relative;
left:0px;
}
.play.rotate {
-webkit-animation:rot 5s linear infinite;
-moz-animation:rot 5s linear infinite;
-ms-animation:rot 5s linear infinite;
-o-animation:rot 5s linear infinite;
animation:rot 5s linear infinite;
/*css3自定义动画*/
}
@keyframes rot {
from {
transform:rotate(0deg);
}
to {
transform:rotate(360deg);
}
}歌词必须要lrc格式的,我写在上面的,歌词格式也必须是下面这种格式
[00:00.79]种种 - 陈粒
[00:01.49]词:张小蜀 曲:陈粒
[00:06.93]你是我梦里
[00:08.53]陌生 熟悉
[00:10.98]与众不同
[00:13.81]你是我梦里
歌词可以百度搜索,然后自己修改一下
关键的地方我都
console.log();
输出来
如果实在看不懂,可以问我的