HTML5期末大作业：饮食网站设计——速鲜站餐饮食品(6页) HTML+CSS+JavaScript 关于的HTML网页设计-----北京

作品介绍

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

2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页）。

3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。

文章目录

HTML5期末大作业：饮食网站设计——速鲜站餐饮食品(6页) HTML+CSS+JavaScript 关于的HTML网页设计-----北京
作品介绍
一、作品展示
二、文件目录
三、代码实现
四、获取更多源码
五、学习资料
六、更多源码

一、作品展示

二、文件目录

三、代码实现

<!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">
<meta name="keywords" content="速鲜站餐饮食品">
<meta name="description" content="速鲜站餐饮食品">
<title>速鲜站餐饮食品</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/slide_show.js"></script>
</head>
<body>
<div id="wrapper"><div id="top"><div class="wrap"><ul class="topNav"><li><a onclick="SetHome(window.location)" href="#">设为首页</a></li><li><s></s><a href="#">收藏本站</a></li></ul></div></div><div id="header"><div class="wrap clearfix"><ul class="logo"><a href="index.html"><img src="picture/logo.png" alt="速鲜站餐饮食品" title="速鲜站餐饮食品"></a></ul><div id="mainNav"><ul class="wrap"><li><a href="index.html" class="first">首页</a></li><li><a href="about.html">公司简介</a><ul><li><a href="#">品牌概念</a></li><li><a href="#">品牌形象</a></li><li><a href="#">品牌成长</a></li><li><a href="#">品牌视频</a></li><li><a href="#">品牌团队</a></li></ul></li><li><a href="product.html">美食展示</a><ul><li><a href="#">现做鲜包</a></li><li><a href="#">鲜榨原汁</a></li><li><a href="#">五谷杂粮</a></li><li><a href="#">其他系列</a></li></ul></li><li><a href="photo.html">门店展示</a></li><li><a href="join.html">加盟合作</a><ul><li><a href="#">加盟条件</a></li><li><a href="#">加盟流程</a></li><li><a href="#">加盟模式和支持</a></li><li><a href="#">加盟费用</a></li><li><a href="#">加盟热线</a></li></ul></li><li><a href="photo.html">新闻资讯</a><ul><li><a href="#">公司动态</a></li><li><a href="#">行业新闻</a></li></ul></li><li class="cur hover"><a href="rczp.html">人才招聘</a><ul><li><a href="#">联系我们</a></li></ul></li><div class="clear"></div></ul></div><div class="tel">加盟热线：0579-85057969</div></div></div><div class="slideShow"><ul class="slides"><li><a href="#" target="_blank" style="background-image:url(images/20130514acunau.jpg)"></a></li></ul></div><script type="text/javascript">$(document).ready(function(){$(".slides").bxSlider({mode:"fade"})});</script><div class="main_index"><div class="wpb_row vc_row-fluid" style="background-color:#fcdb00"><div class="vc_span12 wpb_column column_container"><div class="wpb_wrapper"><div class="wpb_row vc_row-fluid row_width960 index_icon_wrap"><div class="vc_span3 wpb_column column_container pop"><div class="wpb_single_image wpb_content_element zero_side wpb_animate_when_almost_visible wpb_top-to-bottom vc_align_center wpb_start_animation index_icon"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/index_icon_1.png" width="55" height="55" alt="1"></a></div></div><div class="index_icon_enter"><a href="#">速鲜美食<br><small>Products</small></a></div></div><div class="vc_span3 wpb_column column_container pop"><div class="wpb_single_image wpb_content_element zero_side wpb_animate_when_almost_visible wpb_top-to-bottom vc_align_center wpb_start_animation index_icon"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/index_icon_2.png" width="55" height="55" alt="1"></a></div></div><div class="index_icon_enter"><a href="#">公司简介<br><small>Company</small></a></div></div><div class="vc_span3 wpb_column column_container pop"><div class="wpb_single_image wpb_content_element zero_side wpb_animate_when_almost_visible wpb_top-to-bottom vc_align_center wpb_start_animation index_icon"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/index_icon_3.png" width="55" height="55" alt="1"></a></div></div><div class="index_icon_enter"><a href="#">加盟合作<br><small>Join</small></a></div></div><div class="vc_span3 wpb_column column_container pop"><div class="wpb_single_image wpb_content_element zero_side wpb_animate_when_almost_visible wpb_top-to-bottom vc_align_center wpb_start_animation index_icon"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/index_icon_4.png" width="55" height="55" alt="1"></a></div></div><div class="index_icon_enter"><a href="#">联系我们<br><small>Contact</small></a></div></div></div></div></div></div></div><div class="main_index" style="padding:25px 0"><div class="wrap"><div class="index_banner"><img src="picture/index_banner.gif"></div><div class="wpb_row vc_row-fluid index_picnews"><div class="vc_span12 wpb_column column_container"><div class="wpb_wrapper"><div class="wpb_single_image wpb_content_element fix_margin_b15px wpb_left-to-right vc_align_center"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/xwt.jpg" width="405" height="245" alt="新闻图"></a></div></div><div class="index_post_list"><h3>新闻动态<br>News</h3><div class="post_list_in"><ul><li><small>2016-05-26</small><a href="#" title="2016上海餐饮连锁加盟展">2016上海餐饮连锁加盟展</a></li><li><small>2013-06-26</small><a href="#" title="一个新手要如何着手来做好网站运营？">一个新手要如何着手来做好网站运营？</a></li><li><small>2013-06-26</small><a href="#" title="网络营销之该如何打造吸引性的软文营销">网络营销之该如何打造吸引性的软文营销</a></li><li><small>2013-06-26</small><a href="#" title="如何利用电子商务提升企业竞争力">如何利用电子商务提升企业竞争力</a></li></ul></div></div><a class="vc_btn vc_btn_orange vc_btn_xs vc_btn_square" href="#" title="" target="">MORE</a></div></div></div><div class="wpb_row vc_row-fluid index_picnews"><div class="vc_span12 wpb_column column_container"><div class="wpb_wrapper"><div class="wpb_single_image wpb_content_element fix_margin_b15px wpb_left-to-right vc_align_center"><div class="wpb_wrapper"><a href="#"><img class="vc_box_border_grey" src="picture/syxp.jpg" width="405" height="245" alt="新闻图"></a></div></div><div class="index_post_list"><h3>行业新闻<br>News</h3><div class="post_list_in"><ul><li><small>2016-06-13</small><a href="#" title="【干货】包子馒头用“碱”全攻略">【干货】包子馒头用“碱”全攻略</a></li><li><small>2016-05-26</small><a href="#" title="餐饮概念">餐饮概念</a></li><li><small>2016-05-26</small><a href="#" title="提高对食品企业违法行为处罚力度">提高对食品企业违法行为处罚力度</a></li><li><small>2016-05-26</small><a href="#" title="食品科技在酝酿什么大招？">食品科技在酝酿什么大招？</a></li><li><small>2013-06-26</small><a href="#" title="移动互联网发展下的企业网变革">移动互联网发展下的企业网变革</a></li></ul></div></div><a class="vc_btn vc_btn_orange vc_btn_xs vc_btn_square" href="#" title="" target="">MORE</a></div></div></div></div></div><div class="main_index" style="padding:50px 0;background:#f0f0f0"><div class="wrap"><div class="vioeh"><embed src="flash/v.swf" allowfullscreen quality="high" width="550" height="386" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash"></div><div class="index_about"><a href="#" class="about_title"><p>品牌简介</p></a><div class="about_entitle"></div><div class="about_nr" style="font-size:14px;line-height:30px">速鲜站餐饮服务管理有限公司成立与2013年， 本着“经营伙伴的幸福人生， 打造顾客<br>的幸福体验” 的经营理念， 遵循着 “顾客至上， 员工第一” 的原则， 发扬着做事公平、 公正、公开； 做人身正、 言正、 心正的精神。<br>2015年公司正式提出速鲜站3.0时代， 全面升级， 正式定义 “有心有料， 幸福味道 ！” 通过我们的执着追求和努力， 如今已在义乌城区、 乡镇、 金华地区和乐清等地开展多家门店。<br>速鲜站现诚邀天下有识之士， 共同分享餐饮业高速增长带来的巨大商机， 共同为打造国际标准的餐饮品牌而努力。</div></div></div></div><div class="main_index" style="padding:50px 0"><div class="wrap"><div class="product_title"><div class="product_titles">美食展示<br><img src="picture/display.png"></div></div><div class="wpb_row vc_row-fluid row_width960"><div class="vc_span12 wpb_column column_container"><div class="wpb_wrapper"><div id="divRunerWrapper"><div id="divRunerInner"><div id="divRuner"><ul><li><a href="#" title="无矾油条"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/227_thumb.jpg" alt="无矾油条" title="无矾油条"></span></a></li><li><a href="#" title="燕麦馒头"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/226_thumb.jpg" alt="燕麦馒头" title="燕麦馒头"></span></a></li><li><a href="#" title="中式热狗卷"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/225_thumb.jpg" alt="中式热狗卷" title="中式热狗卷"></span></a></li><li><a href="#" title="豆沙包"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/224_thumb.jpg" alt="豆沙包" title="豆沙包"></span></a></li><li><a href="#" title="田园菜包"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/223_thumb.jpg" alt="田园菜包" title="田园菜包"></span></a></li><li><a href="#" title="萧山萝卜干包"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/222_thumb.jpg" alt="萧山萝卜干包" title="萧山萝卜干包"></span></a></li><li><a href="#" title="小米南瓜粥"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/221_thumb.jpg" alt="小米南瓜粥" title="小米南瓜粥"></span></a></li><li><a href="#" title="仙居土猪肉包"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/220_thumb.jpg" alt="仙居土猪肉包" title="仙居土猪肉包"></span></a></li><li><a href="#" title="白粥"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/219_thumb.jpg" alt="白粥" title="白粥"></span></a></li><li><a href="#" title="冰橘柠檬"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/218_thumb.jpg" alt="冰橘柠檬" title="冰橘柠檬"></span></a></li><li><a href="#" title="红糖馒头"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/217_thumb.jpg" alt="红糖馒头" title="红糖馒头"></span></a></li><li><a href="#" title="蔬菜汤"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/216_thumb.jpg" alt="蔬菜汤" title="蔬菜汤"></span></a></li><li><a href="#" title="养生馒头"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/215_thumb.jpg" alt="养生馒头" title="养生馒头"></span></a></li><li><a href="#" title="五香茶叶蛋"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/214_thumb.jpg" alt="五香茶叶蛋" title="五香茶叶蛋"></span></a></li><li><a href="#" title="鲜榨玉米汁"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/213_thumb.jpg" alt="鲜榨玉米汁" title="鲜榨玉米汁"></span></a></li><li><a href="#" title="鲜榨玉米汁"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/212_thumb.jpg" alt="鲜榨玉米汁" title="鲜榨玉米汁"></span></a></li><li><a href="#" title="冰酸梅汁"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/211_thumb.jpg" alt="冰酸梅汁" title="冰酸梅汁"></span></a></li><li><a href="#" title="现榨东北大豆汁"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/210_thumb.jpg" alt="现榨东北大豆汁" title="现榨东北大豆汁"></span></a></li><li><a href="#" title="养颜黑芝麻汁"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/209_thumb.jpg" alt="养颜黑芝麻汁" title="养颜黑芝麻汁"></span></a></li><li><a href="#" title="银耳红枣羹"><span><img width="300" height="200" class="attachment-medium wp-post-image" src="picture/208_thumb.jpg" alt="银耳红枣羹" title="银耳红枣羹"></span></a></li></ul><div class="clearfix"></div><a id="prev" class="prev" href="#">&lt;</a><a id="next" class="next" href="#">&gt;</a></div></div></div></div></div></div></div></div><div class="main_index" style="padding:50px 0;background:#f0f0f0"><div class="product_title"><div class="product_titles" style="background:#f0f0f0">店面形象<br><img src="picture/store.png"></div></div><div class="wpb_row vc_row-fluid"><div class="vc_span12 wpb_column column_container"><div class="wpb_wrapper"><div id="fullScreenRunner"><div><a href="#"><img src="picture/20160525rgkfon.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525vsnoib.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525ovmfbl.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525sypccp.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525ondguo.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525nbmyyn.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525tjklxe.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525gblhdy.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525iylgzp.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525nwmysw.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525bjhqlh.jpg" alt="" width="250" height="179"><span></span></a></div><div><a href="#"><img src="picture/20160525tamkhk.jpg" alt="" width="250" height="179"><span></span></a></div></div></div></div></div></div><div class="clear"></div><div id="footer"><div class="wrap"><div class="foot_top"><div class="foot_logo"><img src="picture/logo.png" alt="速鲜站餐饮食品" title="速鲜站餐饮食品"></div><div class="foot_logo2"></div></div><div class="footNav"><ul><div class="foot_nav_tit"><a href="#">关于我们</a></div><li><a href="#">品牌概念</a></li><li><a href="#">品牌成长</a></li><li><a href="#">品牌视频</a></li><li><a href="#">品牌形象</a></li></ul><ul><div class="foot_nav_tit"><a href="#">产品展示</a></div><li><a href="#">现做鲜包</a></li><li><a href="#">鲜榨原汁</a></li><li><a href="#">五谷杂粮</a></li><li><a href="#">其他系列</a></li></ul><ul><div class="foot_nav_tit"><a href="#">新闻动态</a></div><li><a href="#">公司动态</a></li><li><a href="#">行业新闻</a></li></ul><ul><div class="foot_nav_tit"><a href="#">加盟合作</a></div><li><a href="#">加盟条件</a></li><li><a href="#">加盟流程</a></li><li><a href="#">加盟模式和支持</a></li><li><a href="#">费加盟用</a></li></ul><ul><div class="foot_nav_tit"><a href="#">联系我们</a></div><li><a href="#">联系我们</a></li><li><a href="#">留言反馈</a></li><li><a href="#">人才招聘</a></li></ul><div class="ewm"><img src="picture/ewm.png"></div></div><div class="copyRight">© 速鲜站餐饮食品 2014 All Rights Reserved. <a href="#" target="_blank">Powered by Cbnic</a></div></div></div><div class="font_bottem"><div class="wrap" style="width:990px"><div class="font_bottem_left"><a href="#"></a></div><div class="font_bottem_right">0579-85057969</div></div></div>
</div>
</body>
<script type="text/javascript" src="js/jquery.caroufredsel-6.2.1-packed.js"></script>
<script type="text/javascript" src="js/theme.extend.js"></script>
</html>

四、获取更多源码

~ 关注我，点赞博文~ 每天带你涨知识!
相关问题可以相互学习，可关注↓公Z号获取更多源码 !

五、学习资料

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

六、更多源码

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

学生DW静态网页设计——速鲜站餐饮食品(6页) HTML+CSS+JavaScript 关于食物食品的HTML网页设计-----餐饮相关推荐

HTML5期末大作业：校园网站设计——云南艺术学院文化学院(3页) HTML+CSS+JavaScript web前端开发技术 web课程设计网页规划与设计
HTML5期末大作业:校园网站设计--云南艺术学院文化学院(3页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计计算机毕设网页设计源码常见网页设计 ...
HTML学生个人网站作业设计：电影设计——爱影评在线电影(11页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：电影网站设计——电影资讯博客(5页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：电影网站设计——电影动漫言叶之庭(4页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：电影网站设计——威海影视网站首页(1页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：电影网站设计——电影售票平台网站(8页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：电影网站设计——影视传媒公司网站(8页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：动漫网站设计——我的英雄学院漫画(5页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...
HTML学生个人网站作业设计：动漫网站设计——迪斯尼公主(6页) HTML+CSS+JavaScript 简单DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
一.作品介绍 1.作品简介 :html期末大作业,dw学生网页设计作业, A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局. 2.作品编辑:作品下载后可使用任意HTML编辑软件(如:Dream ...

学生DW静态网页设计——速鲜站餐饮食品(6页) HTML+CSS+JavaScript 关于食物食品的HTML网页设计-----餐饮