master

分支 (1)

管理

管理

master

JD01
/
index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta
      name="description"
      content="京东 JD.COM-专业的综合网上购物商城，销售家电，数码通讯，电脑，家居百货，服装服饰，母婴，图书，食品等数万个品牌优质商品.便捷、诚信的服务，为您提供愉悦的网上购物体验！"
    />
    <meta
      name="Keywords"
      content="网上购物，网上商城，手机，笔记本，电脑，MP3，CD，VCD，DV，相机，数码，配件，手表，存储卡，京东"
    />
    <!-- meta标签中  charset指定的编码方式，description 表示页面的描述，Keywords是搜索引擎页面的关键字，title表示的是页面的标题 -->
    <title>京东（JD.COM）-正品低价、品质保障、配送及时、轻松购物</title>
    <link rel="stylesheet" href="./css/normalize.css" />
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/index.css" />
    <!-- 添加网页标签图标 -->
    <link rel="shortcut icon" href="favicon.ico" />
  </head>
  <body>
    <!-- 广告部分 -->
    <div class="J_event">
      <a href="javascript:;" class="w">
        <i class="icomoon"></i>
      </a>
    </div>
    <!-- 导航模块 -->
    <div class="shortcut">
      <div class="w">
        <ul class="fl">
          <li>
            <i class="pos"></i>
            内蒙古
          </li>
        </ul>
        <ul class="fr">
          <li>
            <a href="#">你好，请登录&nbsp;&nbsp;</a>
            <a href="#" class="style-red">免费注册</a>
          </li>
          <li class="spacer"></li>
          <li>
            <a href="#">我的订单</a>
          </li>
          <li class="spacer"></li>
          <li class="dropdown">
            <a href="#">我的京东</a>
            <i></i>
          </li>
          <li class="spacer"></li>
          <li><a href="#">京东会员</a></li>
          <li class="spacer"></li>
          <li class="dropdown"><a href="#">客户服务</a><i></i></li>
          <li class="spacer"></li>
          <li class="dropdown"><a href="#">网站导航</a><i></i></li>
          <li class="spacer"></li>
          <li style="position: relative; z-index: 1">
            <a href="#">手机京东</a>
            <div class="erweima">
              <img src="./images/erweima.png" alt="" />
            </div>
          </li>
        </ul>
      </div>
    </div>

    <!-- header头部模块 -->
    <div class="header">
      <div class="w inner">
        <!-- logo部分 -->
        <div class="logo">
          <h1>
            <a href="#" title="京东网">京东</a>
          </h1>
        </div>
        <!-- 搜索部分 -->
        <div class="search">
          <input type="text" value="单反相机" />
          <button>
            <i></i>
          </button>
          <em></em>
          <!--em标签表示突出强调文本-->
        </div>
        <!-- 热词部分 -->
        <div class="hotwords">
          <a href="#" class="style-red">学生专享</a>
          <a href="#">300减160</a>
          <a href="#">七折反场</a>
          <a href="#">骑行运动</a>
          <a href="#">家电榜单</a>
          <a href="#">无损播放器</a>
          <a href="#">汽车脚垫</a>
          <a href="#">巧克力</a>
          <a href="#">铝合金门窗</a>
        </div>
        <!-- 购物车部分 -->
        <div class="myCar">
          <i></i>
          <a href="#">我的购物车</a>
          <s>0</s>
        </div>
        <!-- 电脑 -->
        <div class="computer">
          <a href="#">
            <img src="./images/computer.jpg" alt="" height="40" width="190" />
          </a>
        </div>
        <!-- 导航栏信息 -->
        <div class="navitems">
          <ul>
            <li><a href="#">秒杀</a></li>
            <li><a href="#">优惠卷</a></li>
            <li><a href="#">闪购</a></li>
            <li><a href="#">拍卖</a></li>
          </ul>
          <div class="spacer"></div>
          <ul>
            <li><a href="#">京东服饰</a></li>
            <li><a href="#">京东超市</a></li>
            <li><a href="#">生鲜</a></li>
            <li><a href="#">全球购</a></li>
          </ul>
          <div class="spacer"></div>
          <ul>
            <li><a href="#">京东金融</a></li>
          </ul>
        </div>
      </div>
    </div>

    <!-- 商品列表分类 轮播图-->
    <div class="jd">
      <div class="w jd-inner">
        <div class="jd-clo1">
          <ul>
            <li><a href="#">家用电器</a></li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
            <li>
              <a href="#">手机</a>
              <span>/</span>
              <a href="#">运营商</a>
              <span>/</span>
              <a href="#">数码</a>
            </li>
          </ul>
        </div>
        <div class="jd-clo2">
          <div class="jd-clo2-hd">
            <a href="#" class="arr-l"></a>
            <a href="#" class="arr-r"></a>
            <ol>
              <li class="current"></li>
              <li></li>
              <li></li>
              <li></li>
              <li></li>
              <li></li>
              <li></li>
              <li></li>
            </ol>
            <ul>
              <li>
                <a href="#"><img src="./images/banner.jpg" alt="" /></a>
              </li>
            </ul>
          </div>
          <div class="jd-clo2-bd">
            <div class="firstPic">
              <img src="./images/pic1.jpg" alt="" />
            </div>
            <div>
              <img src="./images/pic2.jpg" alt="" />
            </div>
          </div>
        </div>
        <div class="jd-clo3">
          <div class="user">
            <div class="user-info">
              Hi,欢迎来到京东！<br />
              <a href="#">登录</a>
              <a href="#">注册</a>
              <a href="#" class="info-img">
                <img src="./images/no_login.jpg" alt="" />
              </a>
            </div>
            <div class="user-profit">
              <a href="#">新人福利</a>
              <a href="#">PLUS会员</a>
            </div>
          </div>
          <div class="news">
            <div class="tab-hd">
              <a href="javascript:;" class="cuxiao">促销</a>
              <a href="javascript:;">公告</a>
              <a href="#" class="more1">更多</a>
              <div class="line"></div>
            </div>
            <div class="tab-bd">
              <ul>
                <li><a href="#">蓄电池专场下单立减100元</a></li>
                <li><a href="#">蓄电池专场下单立减100元</a></li>
                <li><a href="#">蓄电池专场下单立减100元</a></li>
                <li><a href="#">蓄电池专场下单立减100元</a></li>
              </ul>
            </div>
          </div>
          <div class="jd-service">
            <ul>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
              <li>
                <a href="#">
                  <i class="spriteMap"></i>
                  <p>机票</p>
                </a>
              </li>
            </ul>
          </div>
        </div>
      </div>
      <!-- 广告结束 -->
      <div class="ad">
        <a href="#"></a>
      </div>
    </div>

    <!-- footer -->
    <div class="footer">
      <!-- 多块好省 -->
      <div class="footer-service">
        <div class="w footer-service-inner">
          <ul class="clearfix">
            <li>
              <div class="service_unit">
                <h5>多</h5>
                <p>品类齐全，轻松购物</p>
              </div>
            </li>
            <li>
              <div class="service_unit">
                <h5 class="kuai">快</h5>
                <p>多仓直发，极速配送</p>
              </div>
            </li>
            <li>
              <div class="service_unit">
                <h5 class="好">好</h5>
                <p>正品行货，精致服务</p>
              </div>
            </li>
            <li>
              <div class="service_unit">
                <h5 class="sheng">省</h5>
                <p>天天低价，畅选无阻</p>
              </div>
            </li>
          </ul>
        </div>
      </div>
      <!-- 帮助模块 -->
      <div class="w help">
        <dl>
          <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>
          <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>
          <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>
          <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>
          <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="cover">
          <dt>京东自营覆盖区县</dt>
          <dd class="info">
            京东已向全国2661个区县提供自营配送服务，支持货到付款，pos机刷卡和售后上门服务
          </dd>
          <dd class="more"><a href="#">查看详情</a></dd>
        </dl>
      </div>
      <!-- 版权模块 -->
      <div class="w copyright">
        <div class="links">
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">关于我们</a>
          <span>|</span>
          <a href="#">English</a>
          <span>|</span>
          <a href="#">Site</a>
          <span>|</span>
          <a href="#">Media & IR</a>
        </div>
        <div class="c-info">
          <p>
            京公网安备 110000020000088 号|京 ICP 证070359
            号|互联网药品信息服务资格证编号（京）-经营性-2014-0008|新出发京零
            字第大120007号
          </p>
          <p>
            互联网出版社许可证编号新出网证（京）字150号|出版物经营许可证|网络文化经营许可证京网文[2014]2148-348
            号|违法和不良信息举报电话：4006561155
          </p>
          <p>
            Copyright © 2004 - 2017 京东JD.com
            版权所有|消费者维权热线：4006067733经营证照
          </p>
          <p>京东旗下网站：京东支付|京东云</p>
        </div>
        <div class="tupian">
          <a href="#" class="kexin"></a>
          <a href="#" class="wangluo"></a>
          <a href="#" class="chengxin"></a>
          <a
            href="https://www.12377.cn/node_548446.htm"
            class="wangshang"
            target="_blank"
          ></a>
          <a href="#" class="jubao"></a>
          <a href="#" class="jincha"></a>
        </div>
      </div>
    </div>

    <script src="./js/index.js"></script>
  </body>
</html>