广告区

广告区


本站消息

站长简介/公众号


关注本站官方公众号:程序员总部,领取三大福利! 福利一:python和前端辅导 福利二:进程序员交流微信群,专属于程序员的圈子 福利三:领取全套零基础视频教程(python,java,前端,php)

 价值13000svip视频教程,前端大神匠心打造,零基础前端开发工程师视频教程全套,基础+进阶+项目实战,包含课件和源码

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

2021-07(6)

2021-08(61)

2021-09(62)

2021-10(90)

2021-11(85)

基于html+css的音乐网站网页设计

发布于2022-05-31 22:08     阅读(553)     评论(0)     点赞(7)     收藏(5)




目录

一、要求

二、页面设计

三、源码


一、要求

题目:请同学们以音乐为主题完成一网站设计。(共100分)

综合运用所学习的知识设计音乐网站,网页布局主要包括网站顶部信息,banner,导航,轮播图,主要内容,footer等基本模块。要求学生能灵活使用标准流、浮动和定位等知识利用div+css进行盒子布局。要求同学对HTML的基本元素,如文字、图片、链接、表格、列表、表单和转换效果等进行综合利用,完成网页内容的建设。具体要求如下:

(一)题目要求

1、整体设计:网站设计要求主题鲜明,内容积极向上,页面布局美观紧凑,颜色搭配和谐,图文搭配合理,并能充分表现主题的风格特点。(15分)

2、站点结构:(10分)

1网站结构合理。所有的文件夹与网页资源必须用以英文小写字母来命名;

2除首页外,其他页面的网页文件应放在html文件夹中;

3使用外部CSS样式表时,请放在css文件夹中;

4所有的图片必须放在images文件夹里,可根据实际需要再建立子文件夹存放各类图片;

5网页所使用的脚本语言放在js文件夹中。站点结构具体参考如下:

3、内容规范:链接设计合理,界面友好。所设计的网页便于浏览,网页能在当前主流浏览器Chrome、Firefox等正常打开,无空链接,无乱码。(5分)

4、技术要求:(共70分)

①整个网站除首页外至少包含6个页面,整个网站至少包含7个页面。每页均可链接到首页和其他页面,超链接明显可用;(5分)

②结构与样式相分离,要求建立外链样式表并能正确引入到HTML页面中;(5分)

③每个页面都必须使用div+css进行页面布局,版心页面要求居中对齐;(10分)

④banner设计要有动态效果(含:hover样式、位移、转换、缩放或js等效果);(5分)

⑤所有的网页必须要导航,导航要使用无序列表进行设计,导航链接要分别设计未访问和鼠标悬停时的样式属性;(10分)

⑥要求网站首页要有轮播图设计;(5分)

⑦css样式表尽量使用复合样式表进行定义,样式命名合理规范,可读性强,并在开始位置对页面进行初始化设置;(15分)

⑧首页要求要表单的设计(登录的帐号密码);(5分)

⑨页面要有绝对定位和固定定位的使用,至少各一处;(5分)

10网站js应用,至少一处;(5分)

二、页面设计

共9个页面,以下展示部分页面。

注册页面

登录页面

首页

 华语音乐页面

欧美歌曲页面

 

纯音乐页面

  古风歌曲页面

我的推荐页面 

 

三、源码

该项目使用html语言、VS code软件制作。 

需要源码的朋友,请捐赠10金额后留下邮箱发送:)

原文链接:https://blog.csdn.net/WHT869706733/article/details/124608206


关注本站官方公众号:程序员总部,领取三大福利! 福利一:python和前端辅导 福利二:进程序员交流微信群,专属于程序员的圈子 福利三:领取全套零基础视频教程(python,java,前端,php)
关注公众号:程序员总部,回复前端,免费领取 全套前端视频教程,关注公众号回复前端充值+你的账号,免费为您充值1000积分






所属网站分类: 技术文章 > 博客

作者:我喜欢css

链接:http://www.qianduanheidong.com/blog/article/361090/45bd2aba1dc1f7587c9e/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

7 0
收藏该文
已收藏

评论内容:(最多支持255个字符)