web前端期末大作业：文化网站设计——中国风文化html源码(6个页面) HTML+CSS+JavaScript 期末作业HTML代码

临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~

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

作品介绍

1.网页作品简介方面 ：HTML期末大学生网页设计作业 ,喜欢的可以下载，文章页支持手机PC响应式布局。

2.网页作品编辑方面：此作品为学生个人主页网页设计题材，代码为简单学生水平 html+css 布局制作，作品下载后可使用任意HTML编辑软件(例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有编辑器均可使用)

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

4.网页作品技术方面：使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。 首页制作了留言表单，同时简单使用JavaScript制作了表单判断(提交时表单不能为空)

文章目录

  • web前端期末大作业：文化网站设计——中国风文化html源码(6个页面) HTML+CSS+JavaScript 期末作业HTML代码
  • 作品介绍
  • 一、作品演示
  • 二、代码目录
  • 三、代码实现
  • 四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
  • 五、源码获取
  • 六、更多HTML期末大作业(成品下载)
    • >>>戳我>>>点击进入200例期末大作业作品

二、代码目录

三、代码实现

<!DOCTYPE html>
<html>
<head>
<title>首页</title>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<!-- jQuery (Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- Custom Theme files -->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Fashion Hair Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--webfont-->
<link href='http://fonts.useso.com/css?family=Poiret+One|Lily+Script+One|Raleway:400,300,500,600,200,700' rel='stylesheet' type='text/css'>
<!--webfont-->
<!-- dropdown -->
<script src="js/jquery.easydropdown.js"></script>
<link href="css/nav.css" rel="stylesheet" type="text/css" media="all"/>
<style type="text/css">
body,td,th {font-family: "微软雅黑";color: #011210;
}
a {font-family: "微软雅黑";
}
body {margin-left: 2px;background-color: #FFFFFF;
}
h1,h2,h3,h4,h5,h6 {font-family: "微软雅黑";
}
</style>
<script src="js/modernizr.custom.js"></script>
</head>
<body text="#011210">
<div class="banner-bg" id="home"><div class="container"><div class="header"><div class="logo"><a href="index.html"><FONT face="微软雅黑"><h1>名况文化传媒</h1><span style="color: #011210"><span><strong><span style="color: #07128C; font-style: normal; font-size: 1.1em; text-align: left; font-family: '微软雅黑'; font-weight: 300;">从此改变你的世界</span></strong></span><span style="color: #011210"><span></span></a></div><div class="top-nav">                                        <label class="mobile_menu" for="mobile_menu"><span>Menu</span></label><input id="mobile_menu" type="checkbox"><ul class="nav"><li><span style="font-family: '微软雅黑'"><FONT face=微软雅黑 size=4><a class="active" href="index.html">名况首页</a></FONT></span><FONT face=微软雅黑 size=4><a class="active" href="index.html">　　</a></FONT></li><li><span style="color: #00B29F"><FONT face=微软雅黑 size=4><a href="about.html">关于名况</a></FONT></span><FONT face=微软雅黑 size=4><a href="about.html">　</a></FONT></li><li class="dropdown1"><FONT face=微软雅黑 size=4><a href="typography.html">　服务项目　　</a></FONT><ul class="dropdown2"><li><a href="404.html">地产行业</a></li><li><a href="404.html">教育咨询</a></li><li><a href="404.html">广告策划</a></li><li><a href="404.html">活动策划</a></li></ul></li> <li><FONT face=微软雅黑 size=4><a href="portfolio.html">活动案例　　</a></FONT></li>   <li><FONT face=微软雅黑 size=4><a href="contact.html">联系我们 </a></FONT></li></ul></div><div class="clearfix"></div></div><div  id="top" class="callbacks_container"><ul class="rslides" id="slider4"><li><div class="banner-info"><h3>经典 传承</h3><lable> </lable><p>长沙名况文化传媒有限公司一直致力于商业演出、品牌推广活动、广告策划、承接大型会议、会展以及演出全程承办、演唱会筹划组织、礼仪模特及各类艺员代理、赛事运营、舞美工程设计制作、舞台演艺等影视传媒制作服务。</p></div></li><li><div class="banner-info"><h3>创意 策划</h3><lable> </lable><p>公司通过借鉴与学习各行业的先进经验，依靠强大的社会资源和网络支撑，结合湖南本土市场的传播特征和需求，形成了独具差异化的竞争体系，专注于品牌的整合营销传播，运用活动策划、公关传播、网络营销以及与之相关的策略与咨询服务，为客户量身定制最切合湖南市场环境的传播解决方案，帮助企业打造强势品牌，提高企业知名度、美誉度。</p></div></li><li><div class="banner-info"><h3>诚信 专业</h3><lable> </lable><p>在竞争激烈的市场氛围中，我们秉承 “团结、务实、创新、守信”的服务宗旨，凭借专业的服务，以及全体员工的勤奋努力，致力于为客户打造精品项目服务.</p></div>                                </li></ul></div><!--banner-slide--><script src="js/responsiveslides.min.js"></script><script>// You can also use "$(window).load(function() {"$(function () {// Slideshow 4$("#slider4").responsiveSlides({auto: true,pager: true,nav: true,speed: 500,namespace: "callbacks",before: function () {$('.events').append("<li>before event fired.</li>");},after: function () {$('.events').append("<li>after event fired.</li>");}});});</script><!--//banner-slide--></div></div>
<!--start-banner-bottom--><div class="banner-bottom-section"><div class="container"><div class="banner-bottom-info"><div class="col-md-3 b-grids"><i class="s1"> </i><div class="album-box"><h4>创新</h4><p>弘扬民族优秀文化，倾力打造精品项目</p></div></div><div class="col-md-3 b-grids"><i class="s2"> </i><div class="album-box"><h4>进取</h4><p>开展多种合作交流，实现双赢互利发展</p></div></div><div class="col-md-3 b-grids"><i class="s3"> </i><div class="album-box"><h4>诚信</h4><p>吸纳培养优秀人才，塑造公司良好品牌</p></div></div><div class="col-md-3 b-grids lost"><i class="s4"> </i><div class="album-box"><h4>协作</h4><p>愿与业内有识之士一道，共谋发展，共同成长，携手并进，共创未来</p></div></div><div class="clearfix"></div></div></div></div>
<!--start-welcome--><div class="about"><div class="container"><h3 class="tittle">关于我们</h3><lable class="two"> </lable><h3 class="sub-text">长沙名况文化传媒有限公司</h3><p>公司专注活动策划执行、网络营销推广、品牌策划设计，以高标准、专业化、综合型的品质服务，以整体理念和完善执行力，完美诠释了国内外众多品牌的个性精髓。 名况文化传媒为客户量<span style="width: auto; font-family: '微软雅黑', '宋体';">身定制最切合湖南市场环境的传播解决方案，帮助企业打造强势品牌，提高企业知名度、美誉度。 自成立以来，名况文化传媒已在湖南传媒领域树立了标杆地位，在汽车、家电、金融、消费品、生物制药、IT高科技行业、房地产、建材家具等多领域服务积累了丰富的专业经验和良好的口碑。 凭借多年的经验和传播实践，名况文化传媒在业界拥有追求卓越和实效的良好声誉。我们有幸为众多中国领先企业提供专业服务，并为这些品牌的发展和增值倍感自豪</span>。</p></div></div><div class="copyrights">Collect from <a href="http://www.17sucai.com/" >企业网站</a></div><!--start-banner-bottom--><div class="hair-section"><div class="container"><h3 class="tittle">精彩纷呈</h3><lable class="two"> </lable><h3 class="sub-text">活动报名专区</h3><div class="grid"><div class="col-md-4 h-f"><figure class="effect-jazz"><img src="data:images/s1.jpg" alt="img25"/><figcaption><h2>报名 <span>开始</span></h2><p>中国旅游小姐环球大赛</p><a href="#">View more</a></figcaption>          </figure><div class="hf-text"><h5>湖南赛区</h5><p>招商合作</p></div></div><div class="col-md-4 h-f"><figure class="effect-jazz"><img src="data:images/s2.jpg" alt="img25"/><figcaption><h2>报名 <span>开始</span></h2><p>中国少儿艺术之星大赛</p><a href="#">View more</a></figcaption>            </figure><div class="hf-text"><h5>开始招募</h5><p>招商合作</p></div></div><div class="col-md-4 h-f"><figure class="effect-jazz"><img src="data:images/s3.jpg" alt="img25"/><figcaption><h2>活动 <span>演出</span></h2><p>精品活动大赛，精彩纷呈，盛况空前</p><a href="#">View more</a></figcaption>            </figure><div class="hf-text"><h5>演出时间</h5><p>尽请期待</p></div></div><div class="clearfix"></div></div></div></div><!--news--><div class="news-section"><div class="container"><h3 class="tittle">企业新闻</h3><lable class="two"> </lable><h3 class="sub-text">Donec orci arcu, id massa ac</h3><div class="news-left">         <div class="col-md-6 col-news-right"><div class="col-bottom"><h4>中国旅游环球小姐大赛湖南赛区火热报名中</h4><p style="font-family: '微软雅黑', '宋体'">中国旅游环球小姐大赛湖南赛区火热报名中，诚招企业，共享盛会 </p><a href="#" class="more"> 更多</a></div><div class="col-bottom"><h4>中国少儿艺术之星大赛 开始招募</h4><p style="font-family: '微软雅黑', '宋体'">“启迪艺术智慧，放飞艺术梦想”，日前，由中国少儿艺术联合会、中国国际文化传播集团、香港卫视、中国少儿艺术网等多家单位共同发起举办“少儿艺术之星”电视选拔大赛正式启动，大赛联合多家少儿专业媒体平台，百余家青少年宫、群众艺术馆、艺术学校、儿童电影、电视剧剧组等文化艺术机构，倾力打造大规模高品质的少儿艺术人才选拔工程，为小朋友们提供一个展示自己，追逐梦想的舞台!参赛不设门槛，现正接受报名中，凡年龄3--14周岁,热爱艺术的小朋友均可登录大赛官方网站或通过热线电话直接报名。 </p><a href="#" class="more"> 更多</a></div><div class="col-bottom"><h4>名况文化与睿沃信息达成战略合作 </h4><p>长沙名况文化传媒有限公司与长沙睿沃信息科技有限公司达成战略合作伙伴关系，就互联网运营、策划进行深度合作 </p><a href="#" class="more"> 更多</a></div><div class="clearfix"> </div></div><div class="col-md-6 col-news"><div class="col-news-top"><a href="#" class="date-in"><img class="img-responsive mix-in" src="data:images/c1.jpg" alt=""><div class="month-in"><label><span class="day">30</span><span class="month">March</span></label></div></a><div class="clearfix"> </div></div>                   <div class="col-news-top"><a href="#" class="date-in"><img class="img-responsive mix-in" src="data:images/c2.jpg" alt=""><div class="month-in"><label><span class="day">30</span><span class="month">Aug</span></label></div></a><div class="clearfix"> </div></div><div class="col-news-top"><a href="#" class="date-in"><img class="img-responsive mix-in" src="data:images/c3.jpg" alt=""><div class="month-in"><label><span class="day">24</span><span class="month">Dec</span></label></div></a><div class="clearfix"> </div></div>                  </div><div class="clearfix"> </div></div></div></div><!--/start-footer-section--><div class="footer-section"><div class="container"><div class="footer-grids wow bounceIn animated" data-wow-delay="0.4s"><div class="col-md-3 footer-grid"><h4>关于我们</h4><div class="border2"></div><p>长沙名况文化传媒有限公司一直致力于商业演出、品牌推广活动、广告策划、承接大型会议、会展以及演出全程承办、演唱会筹划组织、礼仪模特及各类艺员代理、赛事运营、舞美工程设计制作、舞台演艺等影视传媒制作服务。</p></div><div class="col-md-3 footer-grid tags"><h4>公司地址</h4><div class="border2"></div><ul class="tag"><li><p>中国.长沙.雨花区长沙大道与花侯路交汇处新华都长沙天地内</p><p>&nbsp;</p></li></ul></div><div class="col-md-3 footer-grid tweet"><h4>联系热线</h4><div class="border2"></div><div class="icon-3-square"><a href="#"><i class="square-3"></i></a>联系</div><div class="icon-text"><p>18614888958</p><h5>&nbsp;</h5></div><div class="clearfix"></div><div class="icon-3-square"><a href="#"><i class="square-3"></i></a>联系</div><div class="icon-text"><p>18900001111<a href="#"></a></p><h5>&nbsp;</h5></div><div class="clearfix"></div></div><div class="col-md-3 footer-grid flickr"><h4>精彩影集</h4><div class="border2"></div><div class="flickr-grids"><div class="flickr-grid"><a href="#"><img src="data:images/f1.jpg" alt=" " title="team" /></a></div><div class="flickr-grid"><a href="#"><img src="data:images/f2.jpg" alt=" " title="team" /></a></div><div class="flickr-grid"><a href="#"><img src="data:images/f1.jpg" alt=" " title="team" /></a></div><div class="clearfix"> </div><div class="flickr-grid"><a href="#"><img src="data:images/f3.jpg" alt=" " title="team" /></a></div><div class="flickr-grid"><a href="#"><img src="data:images/f2.jpg" alt=" " title="team" /></a></div><div class="flickr-grid"><a href="#"><img src="data:images/f4.jpg" alt=" " title="team" /></a></div><div class="clearfix"> </div></div></div><div class="clearfix"></div></div></div></div><!--//end-footer-section--><!--/start-copyright-section--><div class="copyright"><p>Copyright &copy; 2015.Company name All rights reserved</p></div><!--//end-copyright-section--><!--start-smoth-scrolling--><script type="text/javascript">jQuery(document).ready(function($) {$(".scroll").click(function(event){      event.preventDefault();$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);});});</script><!--start-smoth-scrolling--><script type="text/javascript">$(document).ready(function() {/*var defaults = {containerID: 'toTop', // fading element idcontainerHoverID: 'toTopHover', // fading element hover idscrollSpeed: 1200,easingType: 'linear' };*/$().UItoTop({ easingType: 'easeOutQuart' });});</script><a href="#home" id="toTop" class="scroll" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
</body>
</html>
四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)

web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站

五、源码获取

❉ ~ 关注我，点赞博文~ 每天带你涨知识!

❉1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。

❉ 2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者，一起探讨 前端 Node 知识，互相学习」！

❉3.以上内容技术相关问题可以相互学习，可wx公Z号 ---> web前端小日记 获取更多源码 !

六、更多HTML期末大作业(成品下载)

200多例 HTML5期末考核大作业源码 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

web前端期末大作业：文化网站设计——中国风文化html源码(6个页面) HTML+CSS+JavaScript...相关推荐

  1. HTML5期末大作业:影视网站设计——“指环王：护戒使者(13页) TML+CSS+JavaScript 学生DWHTML5网页设计成品_学生DW静态网页设计代做_web课程设计网页制作

    HTML5期末大作业:影视网站设计--"指环王:护戒使者(13页) TML+CSS+JavaScript 学生DWHTML5网页设计成品_学生DW静态网页设计代做_web课程设计网页制作 常 ...

  2. web前端期末大作业：网站设计与实现——咖啡网站HTML+CSS+JavaScript

  3. web前端期末大作业 【网页设计】基于HTML+CSS2 华为商城 5页

    Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 在线商城购物 | 水果商城 | 商城系统建设 | 多平台移动商城 | H5微商城购物商城项 ...

  4. web前端期末大作业：红色主题中国文化网页设计与实现——基于HTML+CSS实现中国梦(20页)

  5. web前端期末大作业 在线电影网页设计与制作 HTML+CSS+JavaScript仿叮当电影网页制作

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

  6. web前端期末大作业——网页制作基础大二dw作业——动画漫展学习资料电影模板(6页)

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

  7. HTML5期末大作业：漫画网站设计——海贼王我当定了(6页) web前端期末大作业 html+css+javascript网页设计实例 企业网站制作 计算机毕设网页设计源码

    HTML5期末大作业:漫画网站设计--海贼王我当定了(6页) web前端期末大作业 html+css+javascript网页设计实例 企业网站制作 计算机毕设网页设计源码 常见网页设计作业题材有 个 ...

  8. HTML5期末大作业：旅行网站设计——开心网旅游(11页) web前端期末大作业 html+css+javascript网页设计实例

    HTML5期末大作业:旅行网站设计--开心网旅游(11页) web前端期末大作业 html+css+javascript网页设计实例 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电 ...

  9. Web前端期末大作业---响应式唯美婚庆公司网站网页设计

    临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?网页要求的总数量太多?HTML网页作业无从下手?没有合适的模板?等等一系列问题.你想要解决的问题,在这里常见网页设计作业题材有 个 ...

最新文章

  1. hdfs dfs的bash hdfs command not found解决方案
  2. RH033 Unit 9 vim: An Advanced Text Editor
  3. 一个Java应届生从上海离职，附项目源码
  4. [常见错误]Python.h: No such file or directory
  5. boost::mp11::mp_similar相关用法的测试程序
  6. 指令寻址方式与数据寻址方式
  7. 光端机的分类有哪些？
  8. mysql创建数据库指定utf 8_MySQL创建数据库时指定编码utf8mb4和添加用户
  9. 日志打印工具类LogUtils
  10. java服务器客户端程序在联机运行时被防火墙拦截
  11. 将List按照指定大小等分的几种实现方式和效率对比及优化
  12. Winform获取本地IP和外网IP
  13. Flink-sql之当前日期
  14. 基于Matlab的随机森林算法实现（附算法介绍及代码详解）
  15. 断点回归matlab,【独家发布】差分断点回归设计（DIRD）及其在人口断点中的应用...
  16. flash ActionScript快速入门（全部章节）
  17. Task4 论文种类分类
  18. 联邦学习隐私保护相关知识总结
  19. Win10 自定义右键新建菜单
  20. Unity模糊远处物体，近处清晰，景深效果

热门文章

  1. 笔记本电脑电池显示4%可用（已接通电源），经过清灰又莫名奇妙的可以续航啦，很奇怪！
  2. 深度模型（四）：Transformer
  3. 网件公司M4100-D12G三层交换机，部分配置说明（1）
  4. Android x86开源项目虚拟机镜像下载（VM/Vbox）
  5. 在Dell服务器PowerEdge R730上安装操作系统
  6. 小学生机器人挑战赛_创意放飞梦想 宝鸡中小学生青少年机器人竞赛显身手
  7. HVGA是320×480,WVGA800×480
  8. 小学计算机网络教室维修制度,学校网络教室使用管理制度
  9. 快排：Qsort函数的使用
  10. qsort的自主实现