最终效果
1.收入侧边栏
找到butterfly配置文件APlayer.min.css把他下载下来,上图第一个
复制代码进入https://tool.oschina.net/codeformat/css格式化
由于.aplayer-body已经开启了fixed定位,只要简单修改一下left并设置最高优先级即可收入侧边栏
我们只需要在css中加入以下代码即可实现收入侧边栏
在代码最后加入即可
.aplayer.aplayer-narrow .aplayer-body {
left: -66px !important;
}
.aplayer-body:hover {
left: 0px !important
}
2.歌词颜色修改
.aplayer .aplayer-lrc p.aplayer-lrc-current {
opacity:1;
overflow:visible;
height:auto!important;
min-height:16px
}
找到如上代码修改如下
.aplayer .aplayer-lrc p.aplayer-lrc-current {
/* 大小 */
font-size: 17px;
/* 颜色 */
color: #1b82f1;
opacity: 1;
overflow: visible;
height: auto !important;
min-height: 16px;
}
.aplayer .aplayer-lrc p {
font-size:12px;
color:#666;
line-height:16px!important;
height:16px!important;
padding:0!important;
margin:0!important;
transition:all .5s ease-out;
opacity:.4;
overflow:hidden
}
再修改上面css样式为
.aplayer .aplayer-lrc p {
font-weight: 700;
font-size:15px;
color:#777;
line-height:16px!important;
height:16px!important;
padding:0!important;
margin:0!important;
transition:all .5s ease-out;
opacity:.4;
overflow:hidden
}
3.最后
保存这个css,替换主题配置文件中的Aplayer.min.css即可
有问题博客联系我