HTML网页设计制作大作业（div+css——节日圣诞节(5页)节日带背景音乐带视频(5页)带登录
2024-05-09 12:21:25
HTML5+CSS大作业——节日圣诞节(5页)节日带背景音乐带视频(5页)带登录
常见网页设计作业题材有
个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他等网页设计题目,A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
文章目录
- HTML5+CSS大作业——节日圣诞节(5页)节日带背景音乐带视频(5页)带登录
- 一、作品展示
- 二、文件目录
- 三、代码实现
- 四、获取更多源码
- 五、学习资料
- 六、更多源码
一、作品展示
二、文件目录
三、代码实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Holiday Christmas</title>
<meta name="keywords" content="" />
<meta name="description" content="" /><link href="tooplate_style.css" rel="stylesheet" type="text/css" /><link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" /><script type="text/javascript" src="js/jquery-1.6.3.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui.min.js" ></script>
<script type="text/javascript">$(document).ready(function(){$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);});</script><link rel="stylesheet" type="text/css" href="css/ddsmoothmenu.css" /><script type="text/javascript" src="js/ddsmoothmenu.js">/***********************************************
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/</script><script type="text/javascript">ddsmoothmenu.init({mainmenuid: "tooplate_menu", //menu DIV idorientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"classname: 'ddsmoothmenu', //class added to menu's outer DIV//customtheme: ["#1c5a80", "#18374a"],contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})</script><link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" />
<script type="text/JavaScript" src="js/slimbox2.js"></script> </head>
<body id="homepage"><div id="tooplate_wrapper"><div id="tooplate_header"><embed src="music/Bells.mp3" autostart="true" loop="true" hidden="true"></embed><div id="site_title"><a href="index.html">Holiday Christmas</a></div><div id="tooplate_menu" class="ddsmoothmenu"><ul><li><a href="index.html" class="selected">首页</a></li><li><a href="news.html">礼物</a><!--<ul><li><a href="news.html">Category One</a></li><li><a href="news.html">Category Two</a></li><li><a href="news.html">Category Three</a></li><li><a href="news.html">Category Four</a></li><li><a href="news.html">Category Five</a></li> </ul>--></li><li><a href="gallery.html">饮食</a></li><li><a href="about.html">地区特色</a></li> <li><a href="contact.html">登录注册</a></li></ul><br style="clear: left" /></div> <!-- end of tooplate_menu --><div class="clear"></div></div> <!-- END of header --><div id="tooplate_middle"><div id="tooplate_slider" ><div class="slider-wrapper theme-default"><div id="slider" class="nivoSlider" style=""><!--<a href="#"><img src="data:images/slider/01.jpg" alt="Slider Image 1" title="Title 1" /></a><a href="#"><img src="data:images/slider/02.jpg" alt="Slider Image 2" title="Title 2" /></a><a href="#"><img src="data:images/slider/03.jpg" alt="Slider Image 3" title="Title 3" /></a><a href="#"><img src="data:images/slider/04.jpg" alt="Slider Image 4" title="Title 4" /></a>--><video src="video/sd.mp4" width="398" height="235" controls="controls"></video></div></div><script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script><!--<script type="text/javascript">$(window).load(function() {$('#slider').nivoSlider({effect: 'fade',controlNav: true, // 1,2,3... navigationdirectionNavHide: false,directionNav: true,animSpeed: 800, // Slide transition speedpauseTime: 4000, // How long each slide will show});});</script>--></div> <!-- END of slider --><div id="middle_content"><h2 class="merrychristmas">Christmas</h2><p>圣诞节（Christmas）又称耶诞节、耶稣诞辰，译名为“基督弥撒”，是西方传统节日，起源于基督教，在每年公历12月25日。弥撒是教会的一种礼拜仪式。圣诞节是一个宗教节，因为把它当作耶稣的诞辰来庆祝，故名“耶诞节”。 [1]
大部分的天主教教堂都会先在12月24日的平安夜，亦即12月25日凌晨举行子夜弥撒，而一些基督教会则会举行报佳音，然后在12月25日庆祝圣诞节；基督教的另一大分支——东正教的圣诞节庆则在每年的1月7日。
圣诞节也是西方世界以及其他很多地区的公共假日，例如：在亚洲的中国香港和澳门地区、马来西亚、新加坡。 古罗马教会在君士坦丁时代（公元313年），就逐渐习惯在十二月二十五日庆祝主的诞生</p><a href="#" class="button button_big">LEARN MORE</a></div><div class="clear"></div></div> <!-- END of middle --><!--<div class="t饮食">Collect from <a href="http://www.cssmoban.com/" >网页模板</a></div>--><div id="tooplate_main"><!--<div class="content_wrapper content_mb_60"><div class="col_3"><img class="img_fl" src="data:images/tooplate_icon_01.png" alt="Image 1" /><div class="text_content"><h4><a href="#">Lorem Ipsum Dolor Sit Amet</a></h4><p>Credit goes to <a rel="nofollow" href="#" target="_parent">Dev7studios</a> for homepage slider. Feel free to customize it.</p></div><a href="#" class="button button_small button_small_green right">More</a></div><div class="col_3"><img class="img_fl" src="data:images/tooplate_icon_02.png" alt="Image 2" /><div class="text_content"><h4><a href="#">Mauris Iaculis Quam Orci</a></h4><p>Donec sed pretium diam at porttitor dolor neque sed mauris.</p></div><a href="#" class="button button_small button_small_green right">More</a></div><div class="col_3 no_margin_right"><img class="img_fl" src="data:images/tooplate_icon_03.png" alt="Image 3" /><div class="text_content"><h4><a href="#">Nullam Vulputate Sem Eu Erat</a></h4><p>Proin magna velit, porta a iaculis sit amet, porta laoreet tellus.</p></div><a href="#" class="button button_small button_small_green right">More</a></div><div class="clear h60"></div><div class="col_3"><img class="img_fl" src="data:images/tooplate_icon_04.png" alt="Image 4" /><div class="text_content"><h4><a href="#">Duis Gravida Augue Interdum Elit</a></h4><p>Mauris iaculis quam orci, a cursus nibh amet diam tempus.</p></div><a href="#" class="button button_small button_small_green right">More</a></div><div class="col_3"><img class="img_fl" src="data:images/tooplate_icon_05.png" alt="Image 5" /><div class="text_content"><h4><a href="#">Etiam Imperdiet Mattis Euismod</a></h4><p>Phasellus bibendum massa vel odio iaculis placerat elit.</p></div><a href="#" class="button button_small button_small_green right">More</a></div><div class="col_3 no_margin_right"><img class="img_fl" src="data:images/tooplate_icon_06.png" alt="Image 6" /><div class="text_content"><h4><a href="#">Aenean Mattis Nunc Ut Lectus</a></h4><p>Nam eget nulla nec augue mollis iaculis nec in elit.</p></div><a href="#" class="button button_small button_small_green right">More</a></div></div>--><div class="col_2"><h2>Recent Articles</h2><ul class="even_list"><li><a href="#"><img src="images/tooplate_image_01.jpg" alt="Image 01" /><span class="title">纪念耶稣出生</span><br/><!--<span class="date">OCT 27, 2048</span>--><span class="intro">据说耶稣是因着圣灵成孕，由圣母玛利亚所生的。神更派遣使者加伯列在梦中晓谕约瑟，叫他不要因为马利亚未婚怀孕而不要她，反而要与她成亲，把那孩子起名为“耶稣”，意思是要他把百姓从罪恶中救出来。
当马利亚快要临盆的时候，罗马政府下了命令，全部人民到伯利恒务必申报户籍。约瑟和马利亚只好遵命。他们到达伯利恒时.....</span></a></li><li><a href="#"><img src="images/tooplate_image_02.jpg" alt="Image 02" /><span class="title">罗马教会设立</span><br/><!--<span class="date">OCT 25, 2048</span>--><span class="intro">4世纪初，1月6日是罗马帝国东部各教会纪念耶稣降生和受洗的双重节日、称为“主显节”（Epiphany），亦称“显现节”，即上帝通过耶稣向世人显示自己。当时只有那路拉冷的教会例外，那里只纪念耶稣的诞生而不纪念耶稣的受洗。后历史学家在罗马基督徒习用的日历中发现公元354年12月25日页内记录着：“基督降生在犹大的伯利恒.....</span></a></li><li><a href="#"><img src="images/tooplate_image_03.jpg" alt="Image 03" /><span class="title">发展</span><br/><!--<span class="date">OCT 20, 2048</span>--><span class="intro">众所周知，圣诞节是为了庆祝耶稣的出生而设立的，但《圣经》中却从未提及耶稣出生在这一天，甚至很多历史学家认为耶稣是出生在春天。直到3世纪，12月25日才被官方定为圣诞节。尽管如此，还是有一些东正教把1月6日、7日定为圣诞节。 [3]
圣诞节本是宗教节日。十九世纪，圣诞卡的流行、圣诞老人的出现，使圣诞节开始渐渐流行起来....... </span></a></li></ul><div class="clear h10"></div><a href="#" class="button button_small button_small_gray">More</a></div><div class="col_2 no_margin_right"><h2>Popular Articles</h2><ul class="even_list"><li><a href="#"><img src="images/tooplate_image_04.jpg" alt="Image 04" /><span class="title">圣诞卡</span><br/><!--<span class="date">OCT 28, 2048</span>--><span class="intro">圣诞卡（圣诞卡片）在美国和欧洲很流行，许多家庭随贺卡带上年度家庭合照或家庭新闻，新闻一般包括家庭成员在过去一年的优点特长等内容。圣诞节这天，指出天下一家世界大同的理想，只有以和平与仁爱的言行达成。寄赠圣诞卡，除表示庆贺圣诞的喜乐外，就是向亲友祝福，以表怀念之情。尤其对在孤寂中的亲友，更是亲切的关怀和安慰。</span></a></li><li><a href="#"><img src="images/tooplate_image_05.jpg" alt="Image 05" /><span class="title">圣诞袜</span><br/><!--<span class="date">OCT 22, 2048</span>--><span class="intro">最早以前是一对红色的大袜子，大小不拘。因为圣诞袜是要用来装礼物的，所以是小朋友最喜欢的东西，晚上他们会将自己的袜子挂在床边，等待第二天早上收礼。</span></a></li><li><a href="#"><img src="images/tooplate_image_06.jpg" alt="Image 06" /><span class="title">圣诞帽</span><br/><br/><!--<span class="date">OCT 8, 2048</span>--><span class="intro">是一顶红色帽子，据说晚上戴上睡觉除了睡得安稳和有点暖外，第二天你还会发现在帽子里多了点心爱的人送的礼物。
圣诞装饰包括以圣诞装饰和圣诞灯装饰的圣诞树，户内以花环和常绿植物加以装饰，特别的冬青和槲寄生是传统采用的材料。在南北美洲和少数欧洲地区，传统上户外以灯光装饰，包括用灯火装饰的雪橇、雪人和其他圣诞形象。冬青和槲寄生是传统采用的材料。市政当局也会对圣诞装饰加以支持，在街道悬挂圣诞标语或者是在广场放置圣诞树。.</span></a></li></ul><div class="clear h10"></div><a href="#" class="button button_small button_small_gray">More</a></div><div class="clear"></div></div> <!-- END of main --><div class="clear"></div>
</div> <!-- END of wrapper -->
<div id="tooplate_footer_wrapper"><div id="tooplate_footer" class="center"><div class="col_4"><h4>Pages</h4><ul class="nobullet bottom_list"><li><a href="index.html">首页</a></li><li><a href="news.html">礼物</a></li><li><a href="gallery.html">饮食</a></li><li><a href="about.html">地区特色</a></li><li><a href="contact.html">登录注册</a></li></ul></div><div class="col_4"><h4>礼物</h4><ul class="nobullet bottom_list"><li><a href="#" target="_parent">圣诞卡</a></li> <li><a href="#" target="_parent">圣诞袜</a></li><li><a href="#" target="_parent">圣诞帽</a></li><li><a href="#" target="_parent">圣诞树</a></li><li><a href="#" target="_parent">圣诞节橱窗</a></li></ul></div><div class="col_4"><h4>饮食</h4><ul class="nobullet bottom_list"><li><a href="#">火鸡</a></li><li><a href="#">glogi酒</a></li><li><a href="#">沙滩宴</a></li><li><a href="#">玉米粥</a></li><li><a href="#">树干蛋糕</a></li></ul></div><div class="col_4 no_margin_right"><h4>地区特色</h4><p><a href="#" target="_blank">英国特色</a>.</p><p><a href="#" target="_parent">美国特色</a></p><p><a href="#" target="_parent">法国特色</a>.</p><P><a href="#">瑞士特色</a></p></div><div class="clear"></div></div> <!-- END of tooplate_footer --> <div id="tooplate_copyright" class="center"><p>Copyright © 2018 Your Company Name | Design: <a href="#" target="_parent">Tooplate</a>. More Templates <a title="圣诞快乐">圣诞快乐</a></p><ul id="social"><li><a href="#"><img src="images/rss.png" alt="RSS" /></a></li><li><a href="#"><img src="images/facebook.png" alt="Facebook" /></a></li><li><a href="#"><img src="images/twitter.png" alt="Twitter" /></a></li><li><a href="#"><img src="images/linkedin.png" alt="Linkedin" /></a></li></ul><div class="clear"></div></div>
</div> <!-- END of tooplate_wrapper --></body>
</html>四、获取更多源码
~ 关注我，点赞博文~ 每天带你涨知识!
相关问题可以相互学习，可关注↓公Z号 获取更多源码 !
五、学习资料
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
六、更多源码
PC电脑端关注我们
HTML5期末考核大作业源码* 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
HTML网页设计制作大作业（div+css——节日圣诞节(5页)节日带背景音乐带视频(5页)带登录相关推荐
- HTML网页设计制作大作业(div+css) ~中华美德6页面带音乐 ~ 学生网页设计作业源码(中华文化)
HTML网页设计制作大作业(div+css) ~ 中华美德6页面带音乐 ~ 学生网页设计作业源码(中华文化) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从 ...
- HTML5期末大作业：京东网购网站设计——京东网购商城模板(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 HTML网页设计制作大作业
HTML5期末大作业:京东网购网站设计--京东网购商城模板(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 HTML网页设计制作大作业 常见网页设计作业题材有 个人. 美食. ...
- html网页设计期末大作业_HTML+CSS+JS网页设计期末课程大作业——橙色的素材火资源整站(25页)
html网页设计期末大作业_HTML+CSS+JS网页设计期末课程大作业--橙色的素材火资源整站(25页) 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游. 电商. 宠物. 电器. 茶叶 ...
- HTML网页设计制作大作业（div+css)--(四大名著 5页 )
⛵ 源码获取 文末联系 ✈ Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 茶文化网站 | 中华传统文化题材 | 京剧文化水墨风书画 | ...
- HTML网页设计制作大作业（div+css）---浩瀚天文 (13页有二级菜单)
⛵ 源码获取 文末联系 ✈ Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | | HTML期末大学生网页设计作业,Web大学生网页 HTML ...
- HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动
Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业游景点介绍 | 旅游风景区 | 家乡介绍 | 等网站的设计与制作 HTML期末大学生网页设计作业 ...
- html网页设计制作大作业（div+css）个人博客（1个页面）
临期末的,有好多web新手的小伙伴们很是发愁,网上找吧 要么付费的,要么就很复杂,根本就不像自己能做出来的.看了我这个资源或许就可以解决你这个问题喽! 作品介绍: 1.网页标题:绿色清新个人博客div ...
- HTML网页设计制作大作业-文化HTML+CSS+JS网页设计期末课程大作业
Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业,茶文化网站 | 中华传统文化题材 | 京剧文化水墨风书画 | 中国民间年画文化艺术网站 | H ...
- web课程设计网页规划与设计：宠物狗狗网站设计——动物介绍(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 HTML网页设计制作大作业
HTML5期末大作业:宠物狗狗网站设计--动物介绍(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 计算机毕设网页设计源码 常见网页设计作业题材 ...
最新文章
- 关于超级计算机的英语作文,中国研制出世界最强超级计算机
- ajax中的同步异步
- Jenkins打包之本地远程自动打包教程
- Java EE业务处理流程与XML的引入
- 厉害了！谷歌新发布的半监督学习算法降低4倍错误率
- Linux系统调用--getrlimit/setrlimit函数详解
- html按钮突出效果,这10个按钮，把 CSS HOVER 的创意发挥到极致了
- chown无效的用户mysql_mysql 从库设置read-only 对super权限的用户无效的问题
- psm倾向得分匹配法举例_倾向得分匹配法的详细解读
- 西门子PLC200SMART（二）
- 人工势场法matlab讲解,传统人工势场法(matlab)
- php cnzz api demo,PHP curl抓取cnzz统计数据
- Android手机“核心科技”---Vibrator（马达）驱动分析
- java 中的连接超时_【java中处理http连接超时的方法】
- 3dmax：3dmax的软件右边栏常用修改器(面挤出、网格/平滑、涡轮平滑、球形化、曲面修改器、星、融化、删除网格修改器、体积选择、优化、UVW贴图修改器、弯曲、置换、噪波、锥化)之详细攻略
- jdbc连接mysql的serverTimeZone参数配置
- 中国煤炭机械行业十四五需求规模与竞争形势分析报告2022版
- python try/except与try/finally使用
- maven导入oracle驱动jar包
- 2018年单招考试计算机试题答案,2018年单招语文模拟试题及答案.doc