900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW

HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW

时间:2020-12-23 13:56:51

相关推荐

HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW

HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 web学生网页设计作业源码

常见网页设计作业题材有个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

1.临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手? 网页要求的总数量太多?

2.没有合适的模板?等等一系列问题。你想要解决的问题,在这篇博文中基本都能满足你的需求~

3.原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,这是一个不错的网页制作,画面精明,非常适合初学者学习使用。

作品介绍

1.网页作品简介:HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。包含:主页、关于我们、登录、注册,总共4个页面。

2.网页作品编辑:此作品为学生期末大作业网页设计题材,代码为简单学生水平 html+css 布局制作,作品下载后可使用任意HTML编辑软件(例如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++等任意HTML软件编辑修改网页)。

3.网页作品布局:网页布局整体为响应式布局、LOGO、导航、主体内容布局。子页面多种布局,兴趣爱好内容使用图片列表布局,成绩页面插入了表格,联系我们使用图片对齐方式设置了左对齐。

4.网页作品技术:使用DIV+CSS制作网页, 背景图、音乐、视频、flash、鼠标经过及选中导航变色效果、下划线 、等。 表单提交、评论留言,并使用JavaScript制作了表单判断(提交时表单不能为空)。

文章目录

HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 web学生网页设计作业源码作品介绍一、作品展示二、文件目录三、代码实现四、web前端(学习资料)

一、作品展示

二、文件目录

三、代码实现

<!DOCTYPE html><html><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>电影网站</title><link rel="stylesheet" href="css/main.css" /><link rel="stylesheet" href="css/style.css" /><link rel="stylesheet" href="css/icofont.css" /><link rel="stylesheet" href="css/mian_style.css" /></head><body><!--头部开始--><header class="header"><div class="container"><div class="header_area"><div class="logo"><a href="index.html"><img src="picture/logo.png" alt="logo"/></a></div><div class="meau"><ul><li><a class="active" href="index.html">首页</a></li><li><a href="movies.html">电影</a></li><li><a href="celebrities.html">明星</a></li><li><a href="hot.html">热点</a></li><li><a href="news.html">新闻</a></li><li style="width: 120px;"><a href="###" class="theme-btn"><i class="icofont icofont-ticket"></i>&nbsp;&nbsp;订票</a></li></ul></div></div></div><!--头部结束--></header><!--内容部分开始--><section id="content"><!--banner开始--><div class="banner"><ul class="list"><li class="on"><a href="#"><img src="picture/b1.jpg" alt="" /></a></li><li><a href="#"><img src="picture/b2.jpg" alt="" /></a></li><li><a href="#"><img src="picture/b3.jpg" alt="" /></a></li><li><a href="#"><img src="picture/b4.jpg" alt="" /></a></li><li><a href="#"><img src="picture/b5.jpg" alt="" /></a></li></ul><ul class="btn"><li class="on">1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul><a href="javascript:;" class="arrow left">&lt</a><a href="javascript:;" class="arrow right">&gt</a></div><!--近期热播--><div class="con_area"><div class="container"><div class="recent_con"><div class="con_top"><h1><i class="icofont icofont-movie" ></i>近期热播</h1><a href="index.html" class="more">MORE>></a></div><div class="con_main"><ul style="overflow:hidden;margin-bottom: 20px;"><li class="img_right"><img src="picture/portfolio1.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><div class="portfolio-content"><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></div></li><li class="img_right"><img src="picture/portfolio2.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li><li class="img_right"><img src="picture/portfolio3.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li><li><img src="picture/portfolio4.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li></ul><ul><li class="img_right"><img src="picture/portfolio5.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li><li class="img_right"><img src="picture/portfolio6.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li><li class="img_right"><img src="picture/portfolio3.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li><li><img src="picture/portfolio4.png" alt="1" /><a><i class="icofont icofont-ui-play"></i></a><h2>Boyz II Men</h2><div class="review"><div class="author-review"><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b><b class="icofont icofont-star"></b></div><h4>180k voters</h4></div></li></ul></div></div></div></div><!--经典电影--><div class="con_area"><div class="container"><div class="jd_con"><div class="con_top"><h1><i class="icofont icofont-film" ></i>经典电影</h1><a href="index.html" class="more">MORE>></a></div><div class="row" style="overflow: hidden; width: 100%;"><div class="col-md-9"><div class="video-area"><img src="picture/video1.png" alt="video" /><a href="###" class="popup-youtube"><i class="icofont icofont-ui-play"></i></a><div class="video-text"><h2>Angle of Death</h2><div class="review"><div class="author-review"><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i></div><h4>180k voters</h4></div></div></div><div class="video-area"><img src="picture/video1.png" alt="video" /><a href="###" class="popup-youtube"><i class="icofont icofont-ui-play"></i></a><div class="video-text"><h2>Angle of Death</h2><div class="review"><div class="author-review"><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i></div><h4>180k voters</h4></div></div></div><div class="video-area"><img src="picture/video1.png" alt="video" /><a href="###" class="popup-youtube"><i class="icofont icofont-ui-play"></i></a><div class="video-text"><h2>Angle of Death</h2><div class="review"><div class="author-review"><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i></div><h4>180k voters</h4></div></div></div><div class="video-area"><img src="picture/video1.png" alt="video" /><a href="###" class="popup-youtube"><i class="icofont icofont-ui-play"></i></a><div class="video-text"><h2>Angle of Death</h2><div class="review"><div class="author-review"><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i><i class="icofont icofont-star"></i></div><h4>180k voters</h4></div></div></div></div></div></div></div></div><!--最新电影--><div class="con_area"><div class="container"><div class="jd_con"><div class="con_top"><h1><i class="icofont icofont-coffee-cup" ></i>最新电影</h1><a href="index.html" class="more">MORE>></a></div></div><div class="news-slide-area"><div class="news-slider"><div class="single-news"><div class="news-bg-1"></div><div class="news-date"><h2><span>NOV</span> 25</h2><h1></h1></div><div class="news-content"><h2>The Witch Queen</h2><p>Witch Queen is a tall woman with a slim build. She has pink hair, which is pulled up under her hat, and teal eyes.</p></div><a href="#">Read More</a></div><div class="single-news"><div class="news-bg-2"></div><div class="news-date"><h2><span>NOV</span> 25</h2><h1></h1></div><div class="news-content"><h2>The Witch Queen</h2><p>Witch Queen is a tall woman with a slim build. She has pink hair, which is pulled up under her hat, and teal eyes.</p></div><a href="#">Read More</a></div><div class="single-news"><div class="news-bg-3"></div><div class="news-date"><h2><span>NOV</span> 25</h2><h1></h1></div><div class="news-content"><h2>The Witch Queen</h2><p>Witch Queen is a tall woman with a slim build. She has pink hair, which is pulled up under her hat, and teal eyes.</p></div><a href="#">Read More</a></div></div></div></div></div></section><!--end start--><footer id="end"><div class="container"><span class="company">北京时代国际影业有限公司</span></div></footer></body><script type="text/javascript" src="js/jquery-1.7.2.min.js" ></script><script type="text/javascript" src="js/main.js"></script></html>


四、web前端(学习资料)

web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)

适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站


HTML5期末大作业:电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 web学生网页设计作业源码

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。