案例/练习代码存这里了喔
品优购购物车页面HTML
点击查看代码
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>我的购物车-品优购</title> <meta name="description" content="品优购JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务，为您提供愉悦的网上购物体验!" /> <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,品优购" /> <!-- 引入facicon.ico网页图标 --> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> <!-- 引入css 初始化的css 文件 --> <link rel="stylesheet" href="css/base.css"> <!-- 引入公共样式的css 文件 --> <link rel="stylesheet" href="css/common.css"> <!-- 引入car css --> <link rel="stylesheet" href="css/car.css"> <!-- 先引入jquery --> <script src="js/jquery.min.js"></script> <!-- 在引入我们自己的js文件 --> <!-- <script src="js/car.js"></script> --> <script src="js/myOwn.js"></script> </head> <body> <!-- 顶部快捷导航start --> <div class="shortcut"> <div class="w"> <div class="fl"> <ul> <li>品优购欢迎您！ </li> <li> <a href="#">请登录</a> <a href="#" class="style-red">免费注册</a> </li> </ul> </div> <div class="fr"> <ul> <li><a href="#">我的订单</a></li> <li class="spacer"></li> <li> <a href="#">我的品优购</a> <i class="icomoon"></i> </li> <li class="spacer"></li> <li><a href="#">品优购会员</a></li> <li class="spacer"></li> <li><a href="#">企业采购</a></li> <li class="spacer"></li> <li><a href="#">关注品优购</a> <i class="icomoon"></i></li> <li class="spacer"></li> <li><a href="#">客户服务</a> <i class="icomoon"></i></li> <li class="spacer"></li> <li><a href="#">网站导航</a> <i class="icomoon"></i></li> </ul> </div> </div> </div> <!-- 顶部快捷导航end --> <div class="car-header"> <div class="w"> <div class="car-logo"> <img src="img/logo.png" alt=""> <b>购物车</b> </div> </div> </div> </div> <div class="c-container"> <div class="w"> <div class="cart-filter-bar"> <em>全部商品</em> </div> <!-- 购物车主要核心区域 --> <div class="cart-warp"> <!-- 头部全选模块 --> <div class="cart-thead"> <div class="t-checkbox"> <input type="checkbox" name="" id="" class="checkall"> 全选 </div> <div class="t-goods">商品</div> <div class="t-price">单价</div> <div class="t-num">数量</div> <div class="t-sum">小计</div> <div class="t-action">操作</div> </div> <!-- 商品详细模块 --> <div class="cart-item-list"> <div class="cart-item check-cart-item"> <div class="p-checkbox"> <input type="checkbox" name="" id="" checked class="j-checkbox"> </div> <div class="p-goods"> <div class="p-img"> <img src="upload/p1.jpg" alt=""> </div> <div class="p-msg">【5本26.8元】经典儿童文学彩图青少版八十天环游地球中学生语文教学大纲</div> </div> <div class="p-price">￥12.60</div> <div class="p-num"> <div class="quantity-form"> <a href="javascript:;" class="decrement">-</a> <input type="text" class="itxt" value="1"> <a href="javascript:;" class="increment">+</a> </div> </div> <div class="p-sum">￥12.60</div> <div class="p-action"><a href="javascript:;">删除</a></div> </div> <div class="cart-item"> <div class="p-checkbox"> <input type="checkbox" name="" id="" class="j-checkbox"> </div> <div class="p-goods"> <div class="p-img"> <img src="upload/p2.jpg" alt=""> </div> <div class="p-msg">【2000张贴纸】贴纸书 3-6岁 贴画儿童 贴画书全套12册 贴画 贴纸儿童 汽</div> </div> <div class="p-price">￥24.80</div> <div class="p-num"> <div class="quantity-form"> <a href="javascript:;" class="decrement">-</a> <input type="text" class="itxt" value="1"> <a href="javascript:;" class="increment">+</a> </div> </div> <div class="p-sum">￥24.80</div> <div class="p-action"><a href="javascript:;">删除</a></div> </div> <div class="cart-item"> <div class="p-checkbox"> <input type="checkbox" name="" id="" class="j-checkbox"> </div> <div class="p-goods"> <div class="p-img"> <img src="upload/p3.jpg" alt=""> </div> <div class="p-msg">唐诗三百首+成语故事全2册 一年级课外书 精装注音儿童版 小学生二三年级课外阅读书籍</div> </div> <div class="p-price">￥29.80</div> <div class="p-num"> <div class="quantity-form"> <a href="javascript:;" class="decrement">-</a> <input type="text" class="itxt" value="1"> <a href="javascript:;" class="increment">+</a> </div> </div> <div class="p-sum">￥29.80</div> <div class="p-action"><a href="javascript:;">删除</a></div> </div> </div> <!-- 结算模块 --> <div class="cart-floatbar"> <div class="select-all"> <input type="checkbox" name="" id="" class="checkall">全选 </div> <div class="operation"> <a href="javascript:;" class="remove-batch"> 删除选中的商品</a> <a href="javascript:;" class="clear-all">清理购物车</a> </div> <div class="toolbar-right"> <div class="amount-sum">已经选<em>1</em>件商品</div> <div class="price-sum">总价： <em>￥12.60</em></div> <div class="btn-area">去结算</div> </div> </div> </div> </div> </div> <!-- footer start --> <div class="footer"> <div class="w"> <!-- mod_service --> <div class="mod_service"> <ul> <li> <i class="mod-service-icon mod_service_zheng"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_kuai"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> </ul> </div> <!-- mod_help --> <div class="mod_help"> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item mod_help_app"> <dt>帮助中心</dt> <dd> <img src="upload/erweima.png" alt=""> <p>品优购客户端</p> </dd> </dl> </div> <!-- mod_copyright --> <div class="mod_copyright"> <p class="mod_copyright_links"> 关于我们 | 联系我们 | 联系客服 | 商家入驻 | 营销中心 | 手机品优购 | 友情链接 | 销售联盟 | 品优购社区 | 品优购公益 | English Site | Contact U </p> <p class="mod_copyright_info"> 地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br> 京ICP备08001421号京公网安备110108007702 </p> </div> </div> </div> <!-- footer end --> </body> </html>
品优购电梯导航HTML
点击查看代码
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>品优购-综合网购首选-正品低价、品质保障、配送及时、轻松购物！</title> <meta name="description" content="品优购JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务，为您提供愉悦的网上购物体验!" /> <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,品优购" /> <!-- 引入facicon.ico网页图标 --> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> <!-- 引入css 初始化的css 文件 --> <link rel="stylesheet" href="css/base.css"> <!-- 引入公共样式的css 文件 --> <link rel="stylesheet" href="css/common.css"> <!-- 引入 首页的css文件 --> <link rel="stylesheet" href="css/index.css"> <script src="js/jquery.min.js"></script> <!-- <script src="js/index.js"></script> --> <script src="js/myOwnIndex.js"></script> </head> <body> <!-- 顶部快捷导航start --> <div class="shortcut"> <div class="w"> <div class="fl"> <ul> <li>品优购欢迎您！ </li> <li> <a href="#">请登录</a> <a href="#" class="style-red">免费注册</a> </li> </ul> </div> <div class="fr"> <ul> <li><a href="#">我的订单</a></li> <li class="spacer"></li> <li> <a href="#">我的品优购</a> <i class="icomoon"></i> </li> <li class="spacer"></li> <li><a href="#">品优购会员</a></li> <li class="spacer"></li> <li><a href="#">企业采购</a></li> <li class="spacer"></li> <li><a href="#">关注品优购</a> <i class="icomoon"></i></li> <li class="spacer"></li> <li><a href="#">客户服务</a> <i class="icomoon"></i></li> <li class="spacer"></li> <li><a href="#">网站导航</a> <i class="icomoon"></i></li> </ul> </div> </div> </div> <!-- 顶部快捷导航end --> <!-- header制作 --> <div class="header w"> <!-- logo --> <div class="logo"> <h1> <a href="index.html" title="品优购">品优购</a> </h1> </div> <!-- search --> <div class="search"> <input type="text" class="text" value="请搜索内容..."> <button class="btn">搜索</button> </div> <!-- hotwrods --> <div class="hotwrods"> <a href="#" class="style-red">优惠购首发</a> <a href="#">亿元优惠</a> <a href="#">9.9元团购</a> <a href="#">美满99减30</a> <a href="#">办公用品</a> <a href="#">电脑</a> <a href="#">通信</a> </div> <div class="shopcar"> <i class="car"> </i>我的购物车 <i class="arrow"> </i> <i class="count">80</i> </div> </div> <!-- header 结束 --> <!-- nav start --> <div class="nav"> <div class="w"> <div class="dropdown fl"> <div class="dt"> 全部商品分类 </div> <div class="dd"> <ul> <li class="menu_item"><a href="#">家用电器</a> <i> </i> </li> <li class="menu_item"> <a href="list.html">手机</a> 、 <a href="#">数码</a> 、 <a href="#">通信</a> <i> </i> </li> <li class="menu_item"><a href="#">电脑、办公</a> <i> </i> </li> <li class="menu_item"><a href="#">家居、家具、家装、厨具</a> <i> </i> </li> <li class="menu_item"><a href="#">男装、女装、童装、内衣</a> <i> </i> </li> <li class="menu_item"><a href="#">个户化妆、清洁用品、宠物</a> <i> </i> </li> <li class="menu_item"><a href="#">鞋靴、箱包、珠宝、奢侈品</a> <i> </i> </li> <li class="menu_item"><a href="#">运动户外、钟表</a> <i> </i> </li> <li class="menu_item"><a href="#">汽车、汽车用品</a> <i> </i> </li> <li class="menu_item"><a href="#">母婴、玩具乐器</a> <i> </i> </li> <li class="menu_item"><a href="#">食品、酒类、生鲜、特产</a> <i> </i> </li> <li class="menu_item"><a href="#">医药保健</a> <i> </i> </li> <li class="menu_item"><a href="#">图书、音像、电子书</a> <i> </i> </li> <li class="menu_item"><a href="#">彩票、旅行、充值、票务</a> <i> </i> </li> <li class="menu_item"><a href="#">理财、众筹、白条、保险</a> <i> </i> </li> </ul> </div> </div> <!-- 右侧导航 --> <div class="navitems fl"> <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> <li><a href="#">团购</a></li> <li><a href="#">拍卖</a></li> <li><a href="#">有趣</a></li> </ul> </div> </div> </div> <!-- nav end --> <!-- main 模块 --> <div class="w"> <div class="main"> <div class="focus fl"> <!-- 左侧按钮 --> <a href="javascript:;" class="arrow-l"> < </a> <!-- 右侧按钮 --> <a href="javascript:;" class="arrow-r"> </a> <!-- 核心的滚动区域 --> <ul> <li> <a href="#"><img src="upload/focus.jpg" alt=""></a> </li> <li> <a href="#"><img src="upload/focus1.jpg" alt=""></a> </li> <li> <a href="#"><img src="upload/focus2.jpg" alt=""></a> </li> <li> <a href="#"><img src="upload/focus3.jpg" alt=""></a> </li> </ul> <!-- 小圆圈 --> <ol class="circle"> </ol> </div> <div class="newsflash fr"> <div class="news"> <div class="news-hd"> 品优购快报 <a href="#">更多</a> </div> <div class="news-bd"> <ul> <li><a href="#">【特惠】爆款耳机5折秒！</a></li> <li><a href="#">【特惠】母亲节，健康好礼低至5折！</a></li> <li><a href="#">【特惠】爆款耳机5折秒！</a></li> <li><a href="#">【特惠】9.9元洗100张照片！</a></li> <li><a href="#">【特惠】长虹智能空调立省1000</a></li> </ul> </div> </div> <div class="lifeservice"> <ul> <li> <a href="#"> <i class="service_ico service_ico_huafei"></i> <p>话费</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> <span class="hot"></span> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> <li> <a href="#"> <i class="service_ico service_ico_feiji"></i> <p>机票</p> </a> </li> </ul> </div> <div class="bargain"> <img src="upload/bargain.jpg" alt=""> </div> </div> </div> </div> <!-- 推荐服务模块 start --> <div class="recommend w"> <div class="recom-hd fl"> <img src="img/clock.png" alt=""> <h3>今日推荐</h3> </div> <div class="recom-bd fl"> <ul> <li> <a href="#"> <img src="upload/pic.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="upload/pic.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="upload/pic.jpg" alt=""> </a> </li> <li class="last"> <a href="#"> <img src="upload/pic.jpg" alt=""> </a> </li> </ul> </div> </div> <!-- 推荐服务模块 end --> <!-- 楼层区 start --> <div class="floor"> <div class="jiadian w"> <div class="box-hd"> <h3>家用电器</h3> <div class="tab-list"> <ul> <li><a href="#" class="style-red">热门</a>|</li> <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> <li><a href="#">空气/净水</a>|</li> <li><a href="#">新奇特</a>|</li> <li><a href="#">高端电器</a></li> </ul> </div> </div> <div class="box-bd"> <ul class="tab-con"> <li class="w209"> <ul class="tab-con-list"> <li> <a href="#">节能补贴</a> </li> <li> <a href="#">4K电视</a> </li> <li> <a href="#">空气净化器</a> </li> <li> <a href="#">IH电饭煲</a> </li> <li> <a href="#">滚筒洗衣机</a> </li> <li> <a href="#">电热水器</a> </li> </ul> <img src="upload/floor-1-1.png" alt=""> </li> <li class="w329"> <img src="upload/pic1.jpg" alt=""> </li> <li class="w219"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-2.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-3.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-4.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-5.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-6.png" alt=""> </a> </div> </li> </ul> <!-- <ul class="tab-con"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> --> </div> </div> <div class="shouji w"> <div class="box-hd"> <h3>手机通讯</h3> <div class="tab-list"> <ul> <li><a href="#" class="style-red">热门</a>|</li> <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> <li><a href="#">空气/净水</a>|</li> <li><a href="#">新奇特</a>|</li> <li><a href="#">高端电器</a></li> </ul> </div> </div> <div class="box-bd"> <ul class="tab-con"> <li class="w209"> <ul class="tab-con-list"> <li> <a href="#">节能补贴</a> </li> <li> <a href="#">4K电视</a> </li> <li> <a href="#">空气净化器</a> </li> <li> <a href="#">IH电饭煲</a> </li> <li> <a href="#">滚筒洗衣机</a> </li> <li> <a href="#">电热水器</a> </li> </ul> <img src="upload/floor-1-1.png" alt=""> </li> <li class="w329"> <img src="upload/pic1.jpg" alt=""> </li> <li class="w219"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-2.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-3.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-4.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-5.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-6.png" alt=""> </a> </div> </li> </ul> <!-- <ul class="tab-con"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> --> </div> </div> <div class="diannao w"> <div class="box-hd"> <h3>电脑办公</h3> <div class="tab-list"> <ul> <li><a href="#" class="style-red">热门</a>|</li> <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> <li><a href="#">空气/净水</a>|</li> <li><a href="#">新奇特</a>|</li> <li><a href="#">高端电器</a></li> </ul> </div> </div> <div class="box-bd"> <ul class="tab-con"> <li class="w209"> <ul class="tab-con-list"> <li> <a href="#">节能补贴</a> </li> <li> <a href="#">4K电视</a> </li> <li> <a href="#">空气净化器</a> </li> <li> <a href="#">IH电饭煲</a> </li> <li> <a href="#">滚筒洗衣机</a> </li> <li> <a href="#">电热水器</a> </li> </ul> <img src="upload/floor-1-1.png" alt=""> </li> <li class="w329"> <img src="upload/pic1.jpg" alt=""> </li> <li class="w219"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-2.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-3.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-4.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-5.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-6.png" alt=""> </a> </div> </li> </ul> <!-- <ul class="tab-con"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> --> </div> </div> <div class="jiaju w"> <div class="box-hd"> <h3>精品家具</h3> <div class="tab-list"> <ul> <li><a href="#" class="style-red">热门</a>|</li> <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> <li><a href="#">空气/净水</a>|</li> <li><a href="#">新奇特</a>|</li> <li><a href="#">高端电器</a></li> </ul> </div> </div> <div class="box-bd"> <ul class="tab-con"> <li class="w209"> <ul class="tab-con-list"> <li> <a href="#">节能补贴</a> </li> <li> <a href="#">4K电视</a> </li> <li> <a href="#">空气净化器</a> </li> <li> <a href="#">IH电饭煲</a> </li> <li> <a href="#">滚筒洗衣机</a> </li> <li> <a href="#">电热水器</a> </li> </ul> <img src="upload/floor-1-1.png" alt=""> </li> <li class="w329"> <img src="upload/pic1.jpg" alt=""> </li> <li class="w219"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-2.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-3.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-4.png" alt=""> </a> </div> </li> <li class="w220"> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-5.png" alt=""> </a> </div> <div class="tab-con-item"> <a href="#"> <img src="upload/floor-1-6.png" alt=""> </a> </div> </li> </ul> <!-- <ul class="tab-con"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> --> </div> </div> </div> <!-- 楼层区 end --> <!-- 固定电梯导航 --> <div class="fixedtool"> <ul> <li class="current">家用电器</li> <li>手机通讯</li> <li>电脑办公</li> <li>精品家具</li> </ul> </div> <!-- footer start --> <div class="footer"> <div class="w"> <!-- mod_service --> <div class="mod_service"> <ul> <li> <i class="mod-service-icon mod_service_zheng"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_kuai"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> <li> <i class="mod-service-icon mod_service_bao"></i> <div class="mod_service_tit"> <h5>正品保障</h5> <p>正品保障，提供发票</p> </div> </li> </ul> </div> <!-- mod_help --> <div class="mod_help"> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item"> <dt>购物指南</dt> <dd> <a href="#">购物流程 </a></dd> <dd> <a href="#">会员介绍 </a></dd> <dd> <a href="#">生活旅行/团购 </a></dd> <dd> <a href="#">常见问题 </a></dd> <dd> <a href="#">大家电 </a></dd> <dd> <a href="#">联系客服 </a></dd> </dl> <dl class="mod_help_item mod_help_app"> <dt>帮助中心</dt> <dd> <img src="upload/erweima.png" alt=""> <p>品优购客户端</p> </dd> </dl> </div> <!-- mod_copyright --> <div class="mod_copyright"> <p class="mod_copyright_links"> 关于我们 | 联系我们 | 联系客服 | 商家入驻 | 营销中心 | 手机品优购 | 友情链接 | 销售联盟 | 品优购社区 | 品优购公益 | English Site | Contact U </p> <p class="mod_copyright_info"> 地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br> 京ICP备08001421号京公网安备110108007702 </p> </div> </div> </div> <!-- footer end --> </body> </html>
本文作者：Code6E
本文链接：https://www.cnblogs.com/road2code/p/17181595.html
版权声明：本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本