期末作业代码⽹页设计代码——蛋糕甜品店铺（11页）HTML+CSS+JavaScript
关。。。
HTML5期末⼤作业：蛋糕甜品⽹站设计——蛋糕甜品店铺(11页) HTML+CSS+JavaScript 关于美⾷甜品的HTML⽹页设计
常见⽹页设计作业题材有 个⼈、美⾷、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节⽇、戒烟、电影、摄影、⽂化、家乡、鲜花、礼品、汽车、其他 等⽹页设计题⽬, A+⽔平作业, 可满⾜⼤学⽣⽹页⼤作业⽹页设计需求, 喜欢的可以下载!
作品介绍
1.⽹页作品简介 ：HTML期末⼤学⽣⽹页设计作业 A+⽔平 ，喜欢的可以下载，⽂章页⽀持⼿机PC响应式布局。
2.⽹页作品编辑：作品下载后可使⽤任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改⽹页）。
3.⽹页作品技术：Div+CSS、⿏标滑过特效、Table、导航栏效果、banner、表单、⼆级三级页⾯等，视频、 ⾳频元素 、Flash，同时设计了logo（源⽂件），基本期末作业所需的知识点全覆盖。
⽂章⽬录
⼀、作品展⽰
⼆、⽂件⽬录
三、代码实现美食甜品食谱
<!doctype html>
<html>
<head>
<meta name="keywords"content="甜爱，SweetLove，甜品，甜点，⽣⽇蛋糕，冰淇淋，冰品"/>
<meta name="description"content="甜爱⽹上商城是专注于甜品销售、进⼝的⽹站，各种甜品、甜点齐全，还有解暑的各种冰品任顾客挑选，让他们感受到爱的温馨。">
<meta charset="utf-8">
<title>我的甜品，你的爱~</title>
<link rel="shortcut icon"href="images/logo_01.png">
<link rel="stylesheet"href="css/index.css">
<script src="www.jq22/jquery/jquery-1.10.2.js"></script>
<script src="js/LiftEffect.js"></script>
<style>
a, a:visited{
color: #E54028;
text-decoration: none;
}
a:hover{
color: #c22d18;
cursor: pointer;
}
*{
margin: 0;
padding: 0;
}
body{
height: 6000px;
}
.lift-nav{
position: fixed;
top: 100px;
left: 30px;
display: none;
}
.lift-nav li{
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
color: #fff;
padding: 10px 10px;
margin-bottom: 10px;
background: skyblue;
cursor: pointer;
}
.lift-nav li.current{
background:#fb0000;
}
}
/
*.t1,.t2,.t3,.t4,.t5,.t6{
width: 800px;
height: 400px;
text-align: center;
line-height: 400px;
background: skyblue;
margin: 100px auto;
font-size: 30px;
color: #fff;
}
.t1{
margin-top: 200px;
}
.t2{
background: pink;
}
.t3{
background: tomato;
}
.t4{
background: grey;
}
.
t5{
background: yellow;
}
.t6{
background: seagreen;
}*/
</style>
<!--Required libraries-->
<script src="js/jquery-v1.10.2.min.js"type="text/javascript"></script>
<script src="js/modernizr-custom-v2.7.1.min.js"type="text/javascript"></script> <script src="js/jquery-finger-v0.1.0.min.js"type="text/javascript"></script>
<!--Include flickerplate-->
<link href="css/flickerplate.css"type="text/css"rel="stylesheet">
<script src="js/flickerplate.min.js"type="text/javascript"></script>
<!--Execute flickerplate-->
<script>
$(document).ready(function(){
$('.flicker-example').flicker();
});
</script>
</head>
>
<div>
<p>红⾖⼭药糕</p>
</div>
</a>
<a href="xiangqing.html"class="gui">
<div>
<p>龟苓膏</p>
</div>
</a>
</li>
</ol>
</div>
<div class="t5">
<ul>
<li></li>
<p>美味蛋糕</p>
<a href="xiangqing.html">+MORE</a>
</ul>
<ol>
<li><a href="xiangqing.html"></a></li>
<li>
<ul class="chuangyi">
<ul class="chuangyi">
<div>创意</div>
</ul>
<ul class="youya">
<div>优雅</div>
</ul>
<ul class="tongqu">
<div>童趣</div>
</ul>
<ul class="ziran">
<div>⾃然</div>
</ul>
</li>
</ol>
</div>
<div class="t6">
<ul>
<li></li>
<p>中秋团圆</p>
<a href="xiangqing.html">+MORE</a> </ul>
<ol>
<li>
<div class="meixin">
<ul>
<h2>流⼼⽉饼开创者</h2>
<p>送精致鸡蛋卷</p>
<a href="xiangqing.html">
<p>进店看看</p>
<div>></div>
</a>
</ul>
</div>
<div class="wufang">
<ul>
<h2>百年匠⼼品质</h2>
<p>送绿⾖冰糕礼盒</p>
<a href="xiangqing.html">
<p>进店看看</p>
<div>></div>
</a>
</ul>
</div>
</li>
<li>
<div class="bandao">
<ul>
<h2>奶黄⽉饼开创者</h2>
<p>送购物袋⼼意卡</p>
<a href="xiangqing.html">
<p>进店看看</p>
<div>></div>
</a>
</ul>
</div>
<div class="danxiang">
<ul>
<h2>⽩莲蓉⽉饼⾸创</h2>
<p>送⼴式风味甜品</p>
<a href="xiangqing.html">
<p>进店看看</p>
<div>></div>
</a>
</ul>
</div>
</li>
</li>
</ol>
<div></div>
</div>
<div class="jingxuan">
<ul>
<p>本周精选专题</p>
<li></li>
<span>⾜不出户，吃遍全球</span>
</ul>
<ol>
<a href="xiangqing.html"><li></li></a>
<a href="xiangqing.html"><div></div></a>
</ol>
</div>
</div>
<!--页脚-->
<div id="footCon">
<ul>
<li>
<div class="cold"></div>
<span></span>
<ol>
<h2>18⼩时低温</h2>
<p>全程冷链配送</p>
</ol>
</li>
<li>
<div class="wuxiu"></div>
<span></span>
<ol>
<h2>7*24⼩时营业</h2>
<p>全年⽆休</p>
</ol>
</li>
<li>
<div class="baoyou"></div>
<span></span>
<ol>
<h2>满88包邮</h2>
<p>次⽇送达</p>
</ol>
</li>
</ul>
<ol>
<li>
<i></i>
<a href="#">www.sweetlove</a>
<div>
<a href="www.weibo"class="weibo"></a>
<a href="wx.qq"class="weixin"></a>
</div>
</li>
<ul>
<li class="text01">
<p>关于甜爱</p>
<span></span>
<a href="#">媒体报道</a>
<a href="#">知识产权</a>
<a href="#">加⼊我们</a>
</li>
<li>
<p>帮助中⼼</p>
<span></span>
<a href="#">购物指南</a>
<a href="#">订单管理</a>