452 lines
23 KiB
HTML
452 lines
23 KiB
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">
|
|
<title>小米商城</title>
|
|
<!-- <link rel="stylesheet" href="http://at.alicdn.com/t/font_2622901_kl3e9hjw79j.css"> -->
|
|
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2624277_wwlda6piim.css">
|
|
<link rel="stylesheet" href="./css/clear.css">
|
|
<link rel="stylesheet" href="./css/public.css">
|
|
<link rel="stylesheet" href="./css/index.css">
|
|
</head>
|
|
<body>
|
|
|
|
<div class="header">
|
|
<div class="header_menu">
|
|
<div class="container hidden">
|
|
<ul class="left left_menu">
|
|
<li>
|
|
<a href="">小米商城</a>
|
|
</li>
|
|
<li>
|
|
<a href="">MIUI</a>
|
|
</li>
|
|
<li>
|
|
<a href="">IoT</a>
|
|
</li>
|
|
<li>
|
|
<a href="">云服务</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="right right_menu">
|
|
<li>
|
|
<a href="">登录</a>
|
|
</li>
|
|
<li>
|
|
<a href="">注册</a>
|
|
</li>
|
|
<li>
|
|
<a href="">消息通知</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<i class="iconfont icon-gouwuchekong"></i>
|
|
<span>购物车(0)</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="header_logo">
|
|
<div class="container">
|
|
<img class="logo left" src="https://s02.mifile.cn/assets/static/image/logo-mi2.png" alt="">
|
|
<ul class="menu left">
|
|
<li>
|
|
<a href="">小米手机</a>
|
|
<div class="down_menu">
|
|
<div class="container hidden">
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/85e44ea2405ff8414148bbde7446b137.png?thumb=1&w=280&h=193&f=webp&q=90" alt="">
|
|
<p class="title">小米MIX FOLD</p>
|
|
<p class="price">9999元起</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<a href="">Redmi 红米</a>
|
|
</li>
|
|
<li>
|
|
<a href="">电视</a>
|
|
</li>
|
|
<li>
|
|
<a href="">小米手机</a>
|
|
</li>
|
|
<li>
|
|
<a href="">Redmi 红米</a>
|
|
</li>
|
|
<li>
|
|
<a href="">电视</a>
|
|
</li>
|
|
<li>
|
|
<a href="">小米手机</a>
|
|
</li>
|
|
<li>
|
|
<a href="">Redmi 红米</a>
|
|
</li>
|
|
<li>
|
|
<a href="">电视</a>
|
|
</li>
|
|
</ul>
|
|
<div class="search right">
|
|
<input type="text" placeholder="最新搜索">
|
|
<ul class="dropmenu">
|
|
<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>
|
|
<i class="iconfont icon-ziyuan"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="content">
|
|
<div class="banner">
|
|
<div class="container banner_center">
|
|
<ul class="banner_menu">
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
<div class="comparison_muen">
|
|
<div class="item1">
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
</div>
|
|
<div class="item2">
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
</div>
|
|
<div class="item3">
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
</div>
|
|
<div class="item4">
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
<div class="comparison_muen_ltem">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ab345272bf9894bb8269d4901344b068.png?thumb=1&w=50&h=50&f=webp&q=90" alt="">
|
|
<p class="introduction">小米MIX FOLD</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<span>手机 电话卡</span>
|
|
<i class="iconfont icon-zhankai"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/268aadece1368da98fcf5553b657cdb3.jpg?w=2452&h=920" alt="">
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="banner_bottom hidden">
|
|
<div class="container">
|
|
<li>
|
|
<div class="bottom_list">
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
<div class="item">
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" alt="">
|
|
<p>小米秒杀</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/5d4298059889417157e8492750328492.jpg?w=632&h=340" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/5d4298059889417157e8492750328492.jpg?w=632&h=340" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/5d4298059889417157e8492750328492.jpg?w=632&h=340" alt="">
|
|
</li>
|
|
</div>
|
|
</ul>
|
|
|
|
|
|
|
|
<div class="phone page_main">
|
|
<div class="container">
|
|
<div class="container-top">
|
|
<div class="containe-top_left">
|
|
<h2>手机</h2>
|
|
</div>
|
|
<div class="container-top_right">
|
|
<div class="more">
|
|
<p>查看更多</p>
|
|
<i class="iconfont icon-gengduotianchong"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-bottom">
|
|
<div class="img-big">
|
|
<img src="http://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c583f2edc613f1be20fa415910b13ce3.jpg?thumb=1&w=293&h=768&f=webp&q=90" alt="">
|
|
</div>
|
|
<div class="img-mini">
|
|
<ul>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
<li>
|
|
<img src="" alt="">
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="banner-box page_main">
|
|
<div class="container">
|
|
<img src="http://cdn.cnbj1.fds.api.mi-img.com/mi-mall/41d16e66381cfeda7b6b39ab67678d5e.jpg?thumb=1&w=1533&h=150&f=webp&q=90" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="jiadian page_main">
|
|
<div class="container">
|
|
<div class="jiadian-top-left">
|
|
<h2>家电</h2>
|
|
</div>
|
|
<div class="jiadian-top-right">
|
|
<h3 class="remen">热门</h3>
|
|
<h3 class="dianshiyingyin">电视影音</h3>
|
|
</div>
|
|
<div class="jiadian-bottom-left">
|
|
<div>
|
|
<ul>
|
|
<li></li>
|
|
<li></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="jiadian-bottom-left">
|
|
<ul>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
<li></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="footer"></div>
|
|
|
|
</body>
|
|
</html> |