淺說一下吧 這個小項目由h5和css還有js和jq寫的

創(chuàng)新互聯(lián)專注于企業(yè)全網(wǎng)營銷推廣、網(wǎng)站重做改版、南崗網(wǎng)站定制設(shè)計、自適應(yīng)品牌網(wǎng)站建設(shè)、成都h5網(wǎng)站建設(shè)、商城網(wǎng)站建設(shè)、集團(tuán)公司官網(wǎng)建設(shè)、成都外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁設(shè)計等建站業(yè)務(wù)，價格優(yōu)惠性價比高，為南崗等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。

主題內(nèi)容為個人音樂 博客等 首頁一級導(dǎo)航欄 以及側(cè)邊欄 整合部分圖標(biāo)(側(cè)邊欄未添加收起操作 時間原因 會的朋友們可以自行添加一個動畫就可以 在main.js中)
中間音樂部分為作者和歌詞 點擊播放的按鈕可彈出對應(yīng)的視頻mv
視頻mv均為酷狗音樂下載

文件夾部分:
css--->層疊樣式表文件
main.css--->index.html(也就是主頁面的樣式)
reset.css--->覆蓋瀏覽器默認(rèn)的css樣式
img--->存放頁面所有的圖片文件(.jpeg、.jpg、.png等圖片)
js--->方便一些功能的實現(xiàn)
jquery.min.js--->jquery框架的js文件
main.js---> 頁面點擊 視頻顯示的實現(xiàn)
media--->存放頁面播放的視頻

看一下整體吧 圖在下面

側(cè)邊欄的設(shè)計：

使用display:line-block布局

main部分: 添加了部分音樂播放

底部區(qū)域：

下載地址:https://download.csdn.net/download/u0/

注意:因為該項目含有視頻文件所以會比較大

聲明:文章所使用所有的小圖標(biāo)均為可商用無版權(quán)圖標(biāo);視頻文件均為酷狗音樂下載 如有侵犯請聯(lián)系我,我將及時刪除內(nèi)容。