大一新生HTML期末作业,音乐网页制作作业

一、作品介绍

HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置，有div的样式格局，这个实例比较全面，有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。

---

二、作品效果

▶️视频演示

https://live.csdn.net/v/embed/240774

(title-W04JP-爱听音乐歌词滚动下载表单（6页）)]

截图演示

06.png

05.png

04.png

03.png

02.png

01.png

---

三、 作品代码

HTML代码

网站首页
歌单分类
会员登陆
会员注册
















每日30首



猜你喜欢



听见不同



私人电台


热门艺人



五月天



陈奕迅



五月天



五月天



五月天


热门MV



CLASS
陈奕迅



小爱情
梁静茹



老唱盘
S.H.E/洪敬尧


曲风流派












Copyright@1998-2020 music.All Rights Reserved.
爱听音乐网版权所有

CSS代码

.web{
    width:1140px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    background:#FFF;
    padding:0px 30px;
    }
.top{
    height:55px;
    padding-top:15px;
    }
.logo{
    width:116px;
    height:39px;
    float:left;
    margin-right:50px;
    }
.nav{
    width:720px;
    height:39px;
    float:left;
    }
.nav ul{
    padding:0px;
    margin:0;
    }
.nav ul li{
    height:39px;
    line-height:39px;
    float:left;
    margin:0px 20px;
    }
.nav ul li a{
    font-size:18px;
    color: #000;
    }
.sous{
    width:140px;
    height:39px;
    float:right;
    }
.inut{
    width:110px;
    height:39px;
    border:none;
    border-bottom: 1px solid #000;
    float:left;
    }
.btn{
    width:30px;
    height:30px;
    background:url(../images/btn.jpg) no-repeat;
    border:none;
    margin-top:10px;    
    }
.banner{
    width:1140px;
    height:364px;
    margin-bottom:25px;
    }
.box1{
    width:910px;
    height:90px;
    margin:0 auto; 
    margin-bottom:40px;
    }
.box1 .bx{
    width:88px;
    height:90px;
    float:left;
    margin:0px 60px;
    text-align:center;
    font-size:14px;
    }
.box1 .bx img{
    margin-bottom:10px;
    }
.tit{
    height:60px;
    line-height:60px;
    padding-left:20px;
    font-size:26px;
    margin-bottom:15px;
    color:#464543;
    }

---

四、更多源码

【干货分享】自学编程的小伙伴可以前往我的 gitee 仓库（持续更新中...）

【web学习指南】从web基础、计算机基础到前端常用框架的教程，涵盖前端大部分必备知识（学习指南 + 技术文章 + 资源分享）

Gitee仓库地址（来个Star吧~）： https://gitee.com/zhanyuqiu2022/my-app