第一章作业 shoppingShow.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>漫步时尚广场-购物列表</title>
<link href="css/show.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/shoppingCart.js"></script>
<script type="text/javascript" src="js/hotAdvise.js"></script>
</head>
<body>
<!--顶部区域 start-->
<div class="top_bg">
<div class="top_content">
<div class="floatl"><img src="images/star.jpg">收藏 | HI,欢迎来订购 !<a href="../manageadmin/login.html" class="orange">[请登录]</a> <a href="register.html" class="orange"> [免费注册]</a></div>
<div class="floatr">客户服务<img src="images/arrow.gif"> 网站导航<img src="images/arrow.gif">
<div class="xl">
<!--购物车-->
<div class="droparrow" οnclick="showCar()"><span class="shopcart"></span>我的购物车
<span class="orange">0</span>件<img src="images/arrow.gif" /></div>
<!--下拉菜单-->
<div class="dropdown" id="dropdown" style="display: none" οndrοp="drop(event)" οndragοver="allowDrop(event)">
<!--<div class="gwc"></div><h3>购物车为空,现在去挑选几件商品</h3></div>-->
<ul class="shop_pic">
</ul>
</div>
</div>
</div>
</div>
</div>
<!--顶部区域 end-->
<div class="clear"></div>
<!--logo和banner start-->
<div class="logo">
<a href="../index.html"><img src="images/logo.jpg"></a><img src="images/banner.jpg" class="floatr "></div>
<!--logo和banner end-->
<!--菜单导航栏 start-->
<div class="nav_bg">
<div class="nav_content">
<ul class="nav">
<li><a href="shoppingIndex.html" class="white">首页</a></li>
<li class="nav_active"><a href="shoppingShow.html" class="white">最新上架</a></li>
<li>品牌活动</li>
<li>原厂直供</li>
<li>团购</li>
<li>限时抢购</li>
<li>促销打折</li>
</ul>
</div>
</div>
<!--菜单导航栏 end-->
<!--中间部分 start-->
<div class="main">
<!--购物分类 start-->
<ul class="menu">
<li><span class="title">女装</span></li>
<li><span class="red_dot"></span><a href="#">上衣</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">下装</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">连衣裙</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">内衣</a><span class="right_arrow"></span></li>
<li><span class="title">男装</span></li>
<li><span class="red_dot"></span><a href="#">T恤</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">短裤</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">衬衫</a><span class="right_arrow"></span></li>
<li><span class="title">童装</span></li>
<li><span class="red_dot"></span><a href="#">上衣</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">裤子</a><span class="right_arrow"></span></li>
<li><span class="title">运动</span></li>
<li><span class="red_dot"></span><a href="#">运动裤</a><span class="right_arrow"></span></li>
<li><span class="red_dot"></span><a href="#">跑步鞋</a><span class="right_arrow"></span></li>
</ul>
<!--购物分类end-->
<!--中间区 start-->
<div class="middle">
<h1 class="pic_title">最新上架</h1>
<div class="pic_list">
<!-- <script type="text/javascript">
var images=["yifu1.jpg","yifu2.jpg","yifu3.jpg","yifu4.jpg","yifu5.jpg","yifu6.jpg","yifu7.jpg","yifu8.jpg",];
var prices=["198.00","69.00","160.00","210.00","70.00","146.00","69.00","239.00"];
var buyers=[324,534,643,678,567,4567,1345,789];
var contents=["冬季新款牛仔外套加厚连帽毛领加绒牛仔棉衣","2015夏新款韩版 透气舒适简约半截袖T恤衫","韩版甜美气质亮片热气球字母中长款圆领短袖T恤","2015款秋新款甜美学院立领中袖套头格子衬衫娃娃衫","2015款秋新款甜美学院立领中袖套头格子衬衫娃娃衫","大码女装胖mm2015夏装新款韩版显瘦露肩镂空连衣裙","v领雪纺背心女夏外穿双层吊带打底衫百搭显瘦无袖上衣","韩版印花无袖短裙背心裙女 高腰连衣裙A字裙秋季"];
for(var i=0;i<images.length;i++){
var goodsInfo="<dl><div><img src='images/shopshow/"+images[i]+"' /></div><dt><span class='price'>¥"+prices[i]
+"元</span><span class='font12'>"+buyers[i]+"人购买</span></dt><dd>"
+contents[i]+"</dd></dl>";
document.write(goodsInfo);
}
</script>-->
<dl>
<div>
<a href="shoppingDetail.html" target="_blank"><img src="images/shopshow/yifu1.jpg" /></a>
</div>
<dt><span class="price">¥198.00元</span><span class="font12">324人购买</span></dt>
<dd>冬季新款牛仔外套加厚连帽毛领加绒牛仔棉衣</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu2.jpg" /></div>
<dt><span class="price">¥69.00元</span><span class="font12">534人购买</span></dt>
<dd>2015夏新款韩版 透气舒适简约半截袖T恤衫</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu3.jpg" /></div>
<dt><span class="price">¥160.00元</span><span class="font12">643人购买</span></dt>
<dd>韩版甜美气质亮片热气球字母中长款圆领短袖T恤</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu4.jpg" /></div>
<dt><span class="price">¥210.00元</span><span class="font12">678人购买</span></dt>
<dd>2015款秋新款甜美学院立领中袖套头格子衬衫娃娃衫</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu5.jpg" /></div>
<dt><span class="price">¥70.00元</span><span class="font12">567人购买</span></dt>
<dd>2015款秋新款甜美学院立领中袖套头格子衬衫娃娃衫</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu6.jpg" /></div>
<dt><span class="price">¥146.00元</span><span class="font12">4567人购买</span></dt>
<dd>大码女装胖mm2015夏装新款韩版显瘦露肩镂空连衣裙</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu7.jpg" /></div>
<dt><span class="price">¥69.00元</span><span class="font12">1345人购买</span></dt>
<dd>v领雪纺背心女夏外穿双层吊带打底衫百搭显瘦无袖上衣</dd>
</dl>
<dl>
<div><img src="images/shopshow/yifu8.jpg" /></div>
<dt><span class="price">¥239.00元</span><span class="font12">789人购买</span></dt>
<dd>韩版印花无袖短裙背心裙女 高腰连衣裙A字裙秋季 </dd>
</dl>
</div>
<!--品牌活动-->
<h1 class="pic_title">品牌活动</h1>
<ul class="pic_list2">
<script type="text/javascript">
var images = ["dress1.jpg", "dress2.jpg", "dress3.jpg", "dress4.jpg"];
var contents = ["独家定制 V 双层欧根纱里衬 色织时装料大牌范蓬蓬长裙", "夏季新款 子域D5656E 简约通勤腰带修身大摆短袖连衣裙", "爱美斯 2015夏季优雅显瘦大摆长裙 中长款复古印花淑女裙", "亿婷2015夏女装新品显瘦飘逸黑白竖条纹阔腿裤七分裤裙"];
for (var i in images) {
var goodsInfo = "<li><img src='images/shopshow/" + images[i] + "'><p>" + contents[i] + "</p></li>";
document.write(goodsInfo);
}
</script>
<!-- <li><img src="images/shopshow/dress1.jpg" />
<p>独家定制 V 双层欧根纱里衬 色织时装料大牌范蓬蓬长裙</p>
</li>
<li><img src="images/shopshow/dress2.jpg" />
<p>夏季新款 子域D5656E 简约通勤腰带修身大摆短袖连衣裙</p>
</li>
<li><img src="images/shopshow/dress3.jpg" />
<p>爱美斯 2015夏季优雅显瘦大摆长裙 中长款复古印花淑女裙 </p>
</li>
<li><img src="images/shopshow/dress4.jpg" />
<p>亿婷2015夏女装新品显瘦飘逸黑白竖条纹阔腿裤七分裤裙</p>
</li>-->
</ul>
</div>
<!--中间区 end-->
<!--右侧热门推荐 start-->
<div class="right_nav" id="right_nav">
<!--
<h1 class="notice_title">热门推荐</h1>
<ul class="pic_list3">
<li><a href="#"><img src="images/shopshow/s1.jpg" /></a>
<p class="price2">¥56.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s2.jpg" /></a>
<p class="price2">¥97.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s3.jpg" /></a>
<p class="price2">¥89.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s4.jpg" /></a>
<p class="price2">¥69.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s5.jpg" /></a>
<p class="price2">¥89.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s6.jpg" /></a>
<p class="price2">¥93.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s7.jpg" /></a>
<p class="price2">¥58.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s8.jpg" /></a>
<p class="price2">¥69.00元</p>
</li>
<li><a href="#"><img src="images/shopshow/s9.jpg" /></a>
<p class="price2">¥78.00元</p>
</li>
</ul>-->
<!--使用脚本的方向定时更新推,下面引入脚本代码也可以放在<head>标签之内荐信息-->
</div>
<!--右侧热门推荐 end-->
</div>
<!--中间部分 end-->
<!--底部 start-->
<div class="clear"></div>
<div class="footer">
<div class="gotop"></div>
<div class="foot_title">
<ul class="foot_pic">
<li><img src="images/gray1.jpg"></li>
<li><img src="images/gray2.jpg"></li>
<li><img src="images/gray3.jpg"></li>
<li><img src="images/gray4.jpg"></li>
<li><img src="images/gray5.jpg"></li>
</ul>
</div>
<ul class="foot_list">
<li>
<div class="floatl">
<p class="red1"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">新手指导</li>
<li>用户注册</li>
<li>电话下单</li>
<li>购物流程</li>
<li>购物保障</li>
<li>服务协议</li>
</ul>
</li>
<li>
<div class="floatl">
<p class="red2"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">支付方式</li>
<li>货到付款</li>
<li>商城卡支付</li>
<li>支付宝、网银支付</li>
<li>优惠券抵用</li>
</ul>
</li>
<li>
<div class="floatl">
<p class="red3"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">配送方式</li>
<li>闪电发货</li>
<li>满百包邮</li>
<li>配送范围及时间</li>
<li>商品验收及签收</li>
<li>服务协议</li>
</ul>
</li>
<li>
<div class="floatl">
<p class="red3"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">售后服务</li>
<li>退换货协议</li>
<li>关于发票</li>
<li>退换货流程</li>
<li>退换货运费</li>
</ul>
</li>
<li>
<div class="floatl">
<p class="red3"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">关于帐号</li>
<li>修改个人信息</li>
<li>修改密码</li>
<li>找回密码</li>
</ul>
</li>
<li>
<div class="floatl">
<p class="red3"></p>
<p class="line1"></p>
</div>
<ul class="floatl">
<li class="font16 padding-bottom">优惠活动</li>
<li>竞拍须知</li>
<li>抢购须知</li>
</ul>
</li>
</ul>
<div class="clear"></div>
<div class="foot_line"></div>
<p align="center" class="padding-top">Copyright 2015-2020 Q- Walking Fashion ES 漫步时尚广场(QST教育)版权所有
<Br/> 中国青岛 高新区河东路8888号 青软教育集团 咨询热线:400-658-0166 400-658-1022 </p>
<p align="center"><img src="images/foot_pic.jpg"></p>
<div class="clear"></div>
</div>
<!--底部 end-->
</body>
</html>