html 自适应 音乐播放器,使用HTML5+Boostrap打造简单的音乐播放器

前言：这个是综合一下我最近在学的东西做的小Demo，到实际使用还有距离，但是用来练手巩固知识点还是不错的，最近在二刷JS书和Boostrap.css的源码，做完这个Demo也算是暂告一段落，接下来是jQuery的源码和Boostrap.js的源码，任务很艰巨呢，加油~在此就不整篇的贴代码了，如果感兴趣的小伙伴可以发消息给我，可以把代码传给你们~

正文：

先上效果图

1.布局：Boostrap里的响应式和自适应布局是自然跑不掉的，container中嵌套row再分别嵌套aside和main(H5新标签)和div(id="musicConsole")。aside是左侧的音乐列表，main是右边的歌词显示框，div是下面的控件框。

2.主要实现功能：

(1)添加歌曲(歌曲列表右上角的“+”图标)和删除歌曲(歌曲列表右上角的“垃圾箱”图标)

(2)点击歌曲列表中的歌曲：会播放对于曲目；如果有歌词，则滚动显示歌词，如果没有歌词则显示“没有歌词”；进度条和时间会随着歌曲的播放而变化。

(3)点击上一首按钮(竖线+三角形)，会播放上一首歌曲：如果有歌词，则滚动显示歌词，如果没有歌词则显示“没有歌词”；进度条和时间会随着歌曲的播放而变化。

点击播放按钮(三角形)&#x