<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>小U商城</title>
<script src="./js/remscale (2).js"></script>
<script src="./js/remscale.js"></script>
<link rel="stylesheet" href="./css/reset.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2915934_lrp9f9kqrdf.css">
<link rel="stylesheet" href="./css/public.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="indexbox">
<!-- 头部 -->
<header>
<div class="header-hd">
<!-- GPS icon -->
<span class="icon_gps iconfont icon-gps"></span>
<img src="./images/-e-logo.png" alt="">
<div class="searchbox">
<input type="search" placeholder="按内容搜索">
<span class="icon_loupe iconfont icon-fangdajing"></span>
</div>
<!-- 商店icon -->
<span class="store iconfont icon-shangdian"></span>
</div>
<div class="header-bd">
<ul class="navlist">
<li class="on"><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 class="soft iconfont icon-im_fenlei"><a href="#">分类</a></div>
</div>
</header>
<div class="banner">
<div class="banner-pic">
<a href="#"><img src="./images/banner.png" alt=""></a>
<ul class="banner-page">
<li></li>
<li></li>
<li class="on"></li>
</ul>
</div>
<ul class="banner-list">
<li>
<a href="#">
<img src="./images/限时秒杀.png" alt="">
<p>限时秒杀</p>
</a>
</li>
<li>
<a href="#">
<img src="./images/热销商品.png" alt="">
<p>热销商品</p>
</a>
</li>
<li>
<a href="#">
<img src="./images/品质大牌.png" alt="">
<p>品质大牌</p>
</a>
</li>
<li>
<a href="#">
<img src="./images/小U自营.png" alt="">
<p>小U自营</p>
</a>
</li>
<li>
<a href="#">
<img src="./images/积分商城.png" alt="">
<p>积分商城</p>
</a>
</li>
</ul>
</div>
<!-- 秒杀 -->
<div class="seckill">
<!-- 秒杀图片盒子 -->
<div class="seckill-left-pic">
<a href="#">
<img src="./images/seckill-left-pic.png" alt="">
</a>
<dl class="seckill-left-list">
<dt>
<span>限时秒杀</span>
<a href="#">查看更多
<i class="arrow iconfont icon-youjiantou"></i>
</a>
</dt>
<dd class="countdown-desc"><span>每天0点场 好货秒不停</span></dd>
<dd class="countdown-time">
<span>05</span>:<span>20</span>:<span>48</span>
</dd>
</dl>
</div>
<!-- 右侧 -->
<div class="seckill-right-pic">
<div class="seckill-top-pic">
<a href="#">
<img src="./images/seckill-right-pic.png" alt="">
</a>
<dl class="seckill-top-list">
<dt>品牌上新</dt>
<dd class="snapup">九点整 抢大牌</dd>
<dd class="redwars">
<a href="#">
<span>疯抢红包</span>
<i class="arrow iconfont icon-youjiantou">
</i>
</a>
</dd>
</dl>
</div>
<div class="seckill-bottom-pic">
<img src="./images/seckill-right-pic2.png" alt="">
<dl class="seckill-bottom-list">
<dt>日用好物</dt>
<dd class="snapup">愿君多采</dd>
<dd class="redwars">
<a href="#">
<span>塞满奖券</span>
<i class="arrow iconfont icon-youjiantou">
</i>
</a>
</dd>
</dl>
</div>
</div>
</div>
<!-- 双十一预购 -->
<div class="pre">
<h6 class="pre-title clearfix">
<span>双11尖货预购</span>
<i>畅购全球</i>
</h6>
<ul class="pre-list">
<li>
<img src="./images/pre-list-1.png" alt="">
<p>套装/礼盒</p>
</li>
<li>
<img src="./images/pre-list-2.png" alt="">
<p>彩妆套装</p>
</li>
<li>
<img src="./images/pre-list-3.png" alt="">
<p>身体乳液/霜</p>
</li>
<li>
<img src="./images/pre-list-4.png" alt="">
<p>爽肤水/化妆水</p>
</li>
</ul>
</div>
<!-- 精选推荐 -->
<div class="recommend">
<h2>精选推荐</h2>
<ul class="recommend-list clearfix">
<li class="recommend-item">
<a href="#">
<img src="./images/recommend-list1.jpg" alt="">
<h6>抗菌袜套健步鞋</h6>
<span>无胶水工艺，抗菌鞋垫</span>
<p>¥<i>59</i>
<span>起</span>
<s>¥69</s>
<i class="more iconfont icon-gengduo"></i>
</p>
</li>
<li class="recommend-item">
<a href="#">
<img src="./images/recommend-list2.jpg" alt="">
<h6>小米炫彩小背包</h6>
<span>小米背景，炫彩出行</span>
<p>¥<i>29</i>
<span>起</span>
<i class="more iconfont icon-gengduo"></i>
</p>
</li>
<li class="recommend-item">
<a href="#">
<img src="./images/recommend-list3.jpg" alt="">
<h6>云弹轻跑鞋</h6>
<span>去弹爆米花袜套抗菌轻跑�
html+css 移动端商城网页设计实现
版权申诉
5星 · 超过95%的资源 143 浏览量
2022-04-27
17:11:53
上传
评论 15
收藏 1.76MB RAR 举报 
小优商城.rar （64个子文件） 
小优商城 css 
order.css 5KB mine.css 3KB reset.css 468B cart.css 7KB show.css 8KB login.css 1KB classify.css 2KB public.css 2KB index.css 9KB list.css 4KB images 
热销商品.png 3KB brand-choice-title.png 571B rank-img.png 37KB -e-首页-选中.png 584B shopping-pic.png 849B
recommend-list3.jpg 32KB 品质大牌.png 2KB myorderlist.png 1KB seckill-left-pic.png 95KB seckill-right-pic2.png 50KB pre-list-3.png 43KB pre-list-2.png 51KB userphoto.jpg 14KB goodslist-pic1.jpg 17KB cartitem-pic2.jpg 17KB banner.png 428KB pre-list-4.png 32KB -e-我 的.png 2KB shopping-pic2.png 970B 积分商城.png 3KB main-right-list_03.jpg 11KB login-logo.png 9KB detail-power-select.png 1KB -e-分类.png 1KB seckill-right-pic.png 40KB show-pic.jpg 94KB goodslist-pic2.jpg 47KB recommend-list1.jpg 28KB cartitem-pic3.jpg 25KB show-banner-pic.jpg 65KB recommend-list2.jpg 32KB pre-list-1.png 43KB recommend-list4.jpg 39KB -e-logo.png 4KB show-pic2.jpg 253KB -e-gps.png 2KB brand-choice-pic.jpg 17KB goodslist-pic4.jpg 22KB goodslist-pic3.jpg 63KB main-right-pic.jpg 35KB show-pic3.jpg 112KB -e-购物 车 (1).png 1KB 小U自营.png 3KB 限时秒杀.png 3KB
classify.html 6KB cart.html 9KB order.html 4KB login.html 1KB index.html 10KB js remscale (2).js 734B remscale.js 445B list.html 6KB mine.html 5KB show.html 7KB
言程序plus
- 粉丝: 2w+
- 资源: 12
下载权益
C知道特权
VIP文章
课程特权
VIP享7折，此内容立减3.57元 开通VIP
- 1
- 2
- 3
- 4
- 5
前往页