xiaomi

最新推荐文章于 2020-08-17 20:17:35 发布

zhao55759013

最新推荐文章于 2020-08-17 20:17:35 发布

阅读量609

点赞数

分类专栏：导航

导航专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="XiaoMi.aspx.cs" Inherits="WebApplication2.XiaoMi" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<link href="icon/gouwuche/iconfont.css" rel="stylesheet" />
<link href="icon/fangdajing/iconfont.css" rel="stylesheet" />
<script src="jquery-3.2.1.min.js"></script>

<style>
body {
font: 12px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;
margin: 0;
padding: 0;
}

form {
margin: 0;
}

.none {
display: none;
}

.top {
width: 100%;
height: 40px;
background: #333;
font-size: 12px;
color: #b0b0b0;
}

.top_container {
width: 1226px;
margin: 0 auto;
}

.top_container a {
color: #b0b0b0;
}

.top_left {
height: 40px;
line-height: 40px;
float: left;
}

.top_right {
width: 120px;
float: right;
margin-left: 15px;
line-height: 40px;
cursor: pointer;
position: relative;
}

.top_right_gouwuche {
z-index: 32;
text-align: center;
display: block;
height: 40px;
background: #424242;
}

.top_right_gouwuche i {
margin-right: 4px;
vertical-align: -2px;
font-size: 18px;
}

.top_right_gouwuche span {
margin-left: -7px;
}

.top_right:hover a {
background: #fff;
color: #ff6a00;
}

.top_right_menu {
width: 315px;
height: 98px;
color: #424242;
position: absolute;
top: 40px;
right: -0.1px;
z-index: 31;
box-shadow: 0px 2px 10px rgba(0,0,0,0.15);
}

.loading {
line-height: 98px;
text-align: center;
background: #fff;
}

.top_midlle {
float: right;
line-height: 40px;
margin-right: 10px;
}

.span {
font-family: sans-serif;
}

.sep {
color: #424242;
margin: 0 0.25em;
}

a {
text-decoration: none;
}

.top_left a:hover {
color: #fff;
}

.top_midlle a:hover {
color: #fff;
}

.header {
height: 100px;
z-index: 20;
position: relative;
}

.header_container {
width: 1226px;
height: 100px;
position: relative;
margin-left: auto;
margin-right: auto;
}

.header_logo {
width: 62px;
float: left;
margin-top: 22px;
}

.header_logo img {
width: 55px;
height: 55px;
overflow: hidden;
}

.doodle, .link-block {
width: 165px;
height: 100px;
z-index: 21;
position: absolute;
left: 69px;
bottom: 0;
background-repeat: no-repeat;
background-position: center center;
text-indent: -9999em;
}

.header_nav {
width: 850px;
height: 100px;
float: left;
}

/*横向导航条*/
.nav-ul {
width: 820px;
height: 88px;
padding: 12px 0 0 30px;
margin: 0;
font-size: 16px;
position: relative;
color: #333;
list-style: none;
float: left;
}

.nav-item {
float: left;
}

.link {
display: block;
/*color: #333;*/
padding: 26px 10px 38px;
}

.link span {
cursor: pointer;
}

.container {
width: 1226px;
margin-left: auto;
margin-right: auto;
}

.children-ul {
width: 1226px;
list-style: none;
}

.children-ul li {
position: relative;
float: left;
width: 180px;
padding: 35px 12px 0;
text-align: center;
font-size: 12px;
}

.children-ul li:not(:first-child):before {
position: absolute;
left: 0;
top: 35px;
z-index: 1;
width: 1px;
height: 100px;
content: "";
background-color: #e0e0e0;
}

.children_tupian {
margin: 0 auto 16px;
width: 160px;
height: 110px;
}

.children_tupian img {
width: 160px;
height: 110px;
display: block;
margin: 0 auto;
}

.flags {
position: absolute;
top: -1px;
width: 100%;
text-align: center;
font-size: 12px;
left: 0;
z-index: 1;
}

.fiag {
width: 66px;
height: 22px;
border: 1px solid #ff6700;
color: #ff6700;
line-height: 22px;
text-align: center;
margin: 0 auto;
}

.price {
color: #ff6700;
margin: 0;
line-height: 20px;
}

.children_xinhao {
color: #333;
margin: 0;
line-height: 20px;
}

.clearfix {
content: " ";
display: table;
}

.header-nav-menu {
width: 100%;
height: 229px;
z-index: 24;
position: absolute;
top: 100px;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
background: #fff;
box-shadow: 0 3px 4px rgba(0,0,0,0.18);
}

.text:hover {
color: #ff6700;
}
/*搜索框*/
.header_search {
float: right;
width: 296px;
margin-top: 25px;
}

.search-form {
position: relative;
width: 296px;
height: 50px;
}

.search-text {
width: 245px;
height: 50px;
border: 1px solid #e0e0e0;
position: absolute;
top: 0px;
right: 51px;
z-index: 1;
padding: 0 10px;
font-size: 14px;
line-height: 50px;
outline: 0;
transition: all 0.2s;
}

.search-word {
position: absolute;
top: 16px;
right: 62px;
z-index: 2;
text-align: right;
transition: all 0.2s;
}

.search-word a {
display: inline-block;
margin-left: 5px;
padding: 0 5px;
font-size: 12px;
background: #eee;
color: #757575;
cursor: pointer;
}

.search-btn {
width: 52px;
height: 50px;
background: #fff;
color: #616161;
border: 1px solid #e0e0e0;
position: absolute;
top: 0;
right: 0;
z-index: 2;
font-size: 24px;
line-height: 24px;
outline: 0;
transition: all 0.2s;
cursor: pointer;
}

.keyword-list {
display: none;
width: 243px;
position: absolute;
top: 50px;
left: 0px;
border: solid 1px #ff6700;
z-index: 20;
background: #fff;
border-top: 0px;
}

/*.hide {
display: none;
}*/

.bordercolor {
border-color: #b0b0b0;
}

.result-list {
list-style: none;
margin: 0;
padding: 0;
}

.result-list li a {
font-size: 12px;
display: block;
position: relative;
color: #424242;
padding: 6px 15px;
}

.result {
position: absolute;
right: 15px;
top: 6px;
color: #b0b0b0;
}

.backg {
background: #eee;
}
/*.search-form:hover .search-text {
border-color: #b0b0b0;
}*/
.search-text:hover {
border-color: #b0b0b0;
}

.search-text:hover + .search-btn {
border-color: #b0b0b0;
}

.search-text:focus, .search-text:focus + .search-btn {
border-color: #ff6700;
}

.search-text:focus ~ .search-word {
opacity: 0;
}

.search-text:focus ~ .keyword-list {
display: block;
}

.search-btn:hover {
background: #ff6700;
border-color: #ff6700;
}

.search-word a:hover {
background: #ff6700;
color: #fff;
}

/*竖向导航菜单*/
.nav-category {
position: relative;
float: left;
width: 127px;
padding-right: 15px;
}

.site-category {
cursor: pointer;
position: absolute;
top: 88px;
left: -92px;
z-index: 21;
width: 234px;
height: 460px;
font-size: 14px;
}

.link-category {
display: block;
padding: 26px 0 38px;
text-align: right;
color: #333;
font-size: 14px;
}

.site-category-ul {
height: 420px;
list-style: none;
border: 0;
color: #fff;
background: rgba(0,0,0,0.6);
margin: 0;
padding: 20px 0;
}

.title {
position: relative;
display: block;
height: 42px;
line-height: 42px;
padding-left: 30px;
}

.title i {
position: absolute;
top: 12px;
right: 20px;
font: 400 20px/15px consolas;
line-height: 16px;
color: rgba(255,255,255,0.5);
}
/*二级菜单*/
#sub {
position: absolute;
left: 234px;
top: 0;
z-index: 24;
height: 458px;
border: 1px solid #e0e0e0;
border-left: 0;
background: #fff;
box-shadow: 0 8px 16px rgba(0,0,0,0.18);
}
/*.site-children {

position:absolute;
left:234px;
top:0;
z-index:24;
height:458px;
border:1px solid #e0e0e0;
border-left:0;
background:#fff;
box-shadow:0 8px 16px rgba(0,0,0,0.18);
}*/
.site-children-col-4, .site-children-col-6, .site-children-col-7, .site-children-col-11, .site-children-col-12 {
width: 995px;
}

.site-children-col-3, .site-children-col-5, .site-children-col-8, .site-children-col-9, .site-children-col-10 {
width: 795px;
}
/*.site-children {
width:795px;
}*/
.children-list {
height: 458px;
margin: 0;
padding: 2px 0;
list-style-type: none;
}

.children-list-col {
float: left;
width: 248px;
}

.children-list li {
position: relative;
float: left;
width: 265px;
height: 76px;
}

.children-list .link {
display: block;
padding: 18px 20px;
line-height: 40px;
color: #333;
transition: color .2s;
}
/*.children-list .tubiao {
width:40px;
height:40px;
margin-right:12px;
vertical-align:middle;

}*/
.children-list .link img {
width: 40px;
height: 40px;
margin-right: 12px;
vertical-align: middle;
}

.children-list textb {
line-height: 40px;
}

.active {
background: #ff6700;
}
</style>

<script>
$(document).ready(function () {

//购物车
$("#top_right_menu").stop().slideUp(0);
$("#top_right").mouseover(function () {

$("#top_right_menu").stop().slideDown(150);
})
$("#top_right").mouseout(function () {

$("#top_right_menu").stop().slideUp(300);
})

//横向导航条
$("#j_navMenu").stop().slideUp(0);

$(".text").on('mouseenter', function () {
$("#j_navMenu").stop().slideDown(150);
$(this).closest("li").addClass("add").siblings().removeClass("add"); //siblings:查询所有兄弟节点
$("#j_navMenu").empty().append($(".add .container").clone());

})

$("#headerid").on('mouseleave', function () {

$("#j_navMenu").stop().slideUp(100);

})

$(".text:gt(7)").off().on('mouseenter', function () {

$("#j_navMenu").stop().slideUp(100);

})

$(".header_logo,.header_search").on('mouseover', function () {
$("#j_navMenu").stop().slideUp(100);
})

//搜索框

$(".search-btn").on('mouseover', function () {
$(".search-text").addClass("bordercolor");
})
$(".search-btn").on('mouseout', function () {
$(".search-text").removeClass("bordercolor");
})

$(".keyword-list").on('mouseenter', 'li', function () {

$(this).addClass("backg").siblings().removeClass("backg");
})
$(".keyword-list").on('mouseleave', function () {
$(".keyword-list li").removeClass("backg");
})

//竖向导航菜单
var sub = $('#sub');
var activeRow; //一级菜单
var activeMenu;
var timer;
var mouseInSub = false;

sub.on('mouseenter', function (e) {
mouseInSub = true;
}).on('mouseleave', function (e) {
mouseInSub = false;
})

var mouseTrack = [];

var moveHandler = function (e) {
mouseTrack.push({ //获取鼠标位置
x: e.pageX,
y: e.pageY
})

if (mouseTrack.length > 3) { //保留三个鼠标位置
mouseTrack.shift();
}
}

function vector(a, b) { //定义向量
return {
x: b.x - a.x,
y: b.y - a.y
}
}

function vectorproduct(v1, v2) { //定义向量叉乘公式
return v1.x * v2.y - v2.x * v1.y;
}

function isPointInTrangle(p, a, b, c) {
var ab = vector(a, b);
var ap = vector(a, p);
var bc = vector(b, c);
var bp = vector(b, p);
var ca = vector(c, a);
var cp = vector(c, p);

var t1 = vectorproduct(ab, ap);
var t2 = vectorproduct(bc, bp);
var t3 = vectorproduct(ca, cp);

return panduan(t1, t2, t3);
}

function panduan(a, b, c) { //向量叉乘算法大于0点在向量左边，三个都大于0则断定点在三角形内
if (a >= 0 && b >= 0 && c >= 0) {
return true;
}
else
return false;
}

function needDelay(elem, leftCorner, currMousePos) { //判断是否需要延迟
var offset = elem.offset();

var topleft = { //上边缘坐标
x: offset.left,
y: offset.top
}

var bottomleft = { //下边缘坐标
x: offset.left,
y: offset.top + elem.height()
}

return isPointInTrangle(currMousePos, leftCorner, topleft, bottomleft); //判断点是否在三角形内
}

$("#site-test").on('mouseenter', function (e) {
$(document).bind('mousemove', moveHandler); //给document绑定鼠标移动事件
})

$("#site-test").on('mouseleave', function (e) {

$('#' + activeRow.data('id') + '').addClass('none'); //隐藏二级菜单的内容
$('#sub').addClass('none');//隐藏二级菜单

if (activeRow) // 去掉上一个一级菜单背景色
{
activeRow.removeClass('active');
activeRow = null;
}

$(document).unbind('mousemove', moveHandler); //给document解除鼠标移动事件
})

$(".site-category-ul").on('mouseenter', 'li', function (e) {
sub.removeClass('none');
if (!activeRow) {

activeRow = $(this).addClass('active');
activeMenu = $('#' + activeRow.data('id'));
activeMenu.removeClass('none');

return;
}

if (timer) {

clearTimeout(timer);
}

var currMousePos = mouseTrack[mouseTrack.length - 1]; //鼠标当前坐标

var leftCorner = mouseTrack[mouseTrack.length - 2]; //a点坐标

var delay = needDelay(sub, leftCorner, currMousePos); //上下边缘坐标

if (delay) { //在三角形内，setimeout延迟特性加进来

timer = setTimeout(function () {
if (mouseInSub) {
return;
}

activeRow.removeClass('active');
activeMenu.addClass('none');

activeRow = $(e.target);
alert(JSON.stringify(activeRow));
activeRow.addClass('active');

activeMenu.removeClass('none');
timer = null;

}, 300)
}
else {

var prevActiveRow = activeRow;
var prevActiveMenu = activeMenu;

activeRow = $(this);
activeMenu = $('#' + activeRow.data('id'));

prevActiveRow.removeClass('active');
prevActiveMenu.addClass('none');

activeRow.addClass('active');
activeMenu.removeClass('none');
}

})
})
</script>
</head>
<body>

<div class="top">
<div class="top_container">
<div class="top_left">
<a href="#">小米商城</a>
<span class="sep">|</span>
<a href="#">MIUI</a>
<span class="sep">|</span>
<a href="#">IoT</a>
<span class="sep">|</span>
<a href="#">云服务</a>
<span class="sep">|</span>
<a href="#">水滴</a>
<span class="sep">|</span>
<a href="#">金融</a>
<span class="sep">|</span>
<a href="#">有品</a>
<span class="sep">|</span>
<a href="#">Select Region</a>

</div>
<div id="top_right" class="top_right">
<a class="top_right_gouwuche" href="#">
<i class="iconfont icon-icon8"></i>
购物车
<span>（0）</span>
</a>
<div id="top_right_menu" class="top_right_menu">
<div class="loading">购物车中还没有商品，赶紧选购吧！</div>
</div>
</div>
<div class="top_midlle">
<a href="#">登录</a>
<span class="sep">|</span>
<a href="#">注册</a>
<span class="sep">|</span>
<a href="#">消息通知</a>

</div>
</div>
</div>
<div class="header" id="headerid">
<div class="header_container">
<div class="header_logo">
<a>
<img src="images/mi_logo.jpg" />
</a>
<div class="doodle">
<a class="link_block"></a>
</div>
</div>
<div class="header_nav" id="test">
<ul class="nav-ul" id="nav-ul">
<li id="categoryid" class="nav-category">
<a class="link-category">
<span></span>
</a>

<div class="site-category" id="site-test">
<ul class="site-category-ul">
<li data-id="a">
<a class="title">手机电话卡
<i>></i>
</a>
</li>

<li data-id="b">
<a class="title">电视盒子
<i>></i>
</a>
</li>

<li data-id="c">
<a class="title">笔记本
<i>></i>
</a>
</li>

<li data-id="d">
<a class="title">智能家电
<i>></i>
</a>
</li>

<li data-id="e">
<a class="title">健康家居
<i>></i>
</a>
</li>
<li data-id="f">
<a class="title">出行儿童
<i>></i>
</a>
</li>

<li data-id="g">
<a class="title">路由器手机配件
<i>></i>
</a>
</li>

<li data-id="h">
<a class="title">移动电源插线板
<i>></i>
</a>
</li>

<li data-id="i">
<a class="title">耳机音响
<i>></i>
</a>
</li>

<li data-id="j">
<a class="title">生活米兔
<i>></i>
</a>
</li>

</ul>

<div id="sub" class="none">
<div id="a" class="none site-children site-children-col-3">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-mix2s.png" />
<span class="textb">小米MIX 2S</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-note3.png" />
<span class="textb">小米Note 3</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-mix2.png" />
<span class="textb">小米MIX 2</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-xm6.png" />
<span class="textb">小米6</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-5x.png" />
<span class="textb">小米5X</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-xm-max2.jpg" />
<span class="textb">小米Max 2</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-note5.png" />
<span class="textb">红米Note 5</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-5plus.png" />
<span class="textb">红米5 Plus</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-5.png" />
<span class="textb">红米5</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-5a.png" />
<span class="textb">红米5A</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-note5a.png" />
<span class="textb">红米Note 5A</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-note4x.png" />
<span class="textb">红米Note 4X</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-4a.png" />
<span class="textb">红米4A</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-4gzq.jpg" />
<span class="textb">移动4G+专区</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-dbsj.jpg" />
<span class="textb">对比手机</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-mfk.jpg" />
<span class="textb">米粉卡日租卡</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-dhk.jpg" />
<span class="textb">小米移动电话卡</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-wx.png" />
<span class="textb">手机上面维修</span>
</a>
</li>
</ul>
</div>

<div id="b" class="none site-children site-children-col-4">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4C50.jpg" />

<span class="textb">小米电视4C 50英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a32.jpg" />
<span class="textb">小米电视4A 32英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a40.jpg" />
<span class="textb">小米电视4A 40英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4A43.jpg" />
<span class="textb">小米电视4A 43英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a49.jpg" />
<span class="textb">小米电视4A 49英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a50.jpg" />
<span class="textb">小米电视4A 50英寸</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a55.jpg" />
<span class="textb">小米电视4A 55英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a65.jpg" />
<span class="textb">小米电视4A 65英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4c43.png" />
<span class="textb">小米电视4C 43英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4c55.png" />
<span class="textb">小米电视4C 55英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a32ty.jpg" />
<span class="textb">小米电视4A 32英寸体育版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4a43ty.jpg" />
<span class="textb">小米电视4A 43英寸体育版</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4c55ty.jpg" />
<span class="textb">小米电视4C 55英寸体育版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-449.jpg" />
<span class="textb">小米电视4 49英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-455.jpg" />
<span class="textb">小米电视4 55英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-465.jpg" />
<span class="textb">小米电视4 65英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4s55.png" />
<span class="textb">小米电视4S 55英寸</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ds-4s32.jpg" />
<span class="textb">小米电视4S 32英寸</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-4.jpg" />
<span class="textb">小米盒子 4</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-4c.jpg" />
<span class="textb">小米盒子 4c</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-3zq.jpg" />
<span class="textb">小米盒子3 增强版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-3s.jpg" />
<span class="textb">小米盒子3S</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-3c.jpg" />
<span class="textb">小米盒子3C</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/hz-pj.jpg" />
<span class="textb">电视盒子配件</span>
</a>
</li>
</ul>
</div>

<div id="c" class="none site-children site-children-col-5">
<ul class="children-list children-list-col">
<li>
<a class="link">

<img src="XiaoMi_phto/category_img/bjb-156.png" />
<span class="textb">小米游戏本 15.6"</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-air125.jpg" />
<span class="textb">笔记本Air 12.5"</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-air133du.jpg" />
<span class="textb">笔记本Air 13.3"独显</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-air133ji.jpg" />
<span class="textb">笔记本Air 13.3"集显</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-air1334h.png" />
<span class="textb">笔记本Air 13.3"四核增强</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-pro156.png" />
<span class="textb">笔记本Pro 15.6"</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-dy.jpg" />
<span class="textb">USB-C电源适配器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-zjq.jpg" />
<span class="textb">HDMI转接器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-vga.png" />
<span class="textb">VGA千兆网口转接器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-ndb.jpg" />
<span class="textb">小米笔记本内胆包</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-jp.jpg" />
<span class="textb">悦米机械键盘</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/bjb-sb.jpg" />
<span class="textb">小米便携鼠标</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-hm-4a.png" />
<span class="textb">红米4A</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-4gzq.jpg" />
<span class="textb">移动4G+专区</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-dbsj.jpg" />
<span class="textb">对比手机</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-mfk.jpg" />
<span class="textb">米粉卡日租卡</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-dhk.jpg" />
<span class="textb">小米移动电话卡</span>
</a>
</li>
<li>
<a class="link">
<img class="tubiao" src="XiaoMi_phto/category_img/sj-wx.png" />
<span class="textb">手机上面维修</span>
</a>
</li>
</ul>
</div>

<div id="d" class="none site-children site-children-col-6">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jhq2.jpg" />
<span class="textb">空气净化器2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jhqpro.jpg" />
<span class="textb">空气净化器Pro</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jhq2s.jpg" />
<span class="textb">净化器2S</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jhqmax.jpg" />
<span class="textb">净化器MAX</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-czjhq.jpg" />
<span class="textb">车载空气净化器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-lx.jpg" />
<span class="textb">空气滤芯</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jsq.jpg" />
<span class="textb">净水器(厨下式)</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jsqlx.jpg" />
<span class="textb">净水器滤芯</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-mjsh.jpg" />
<span class="textb">米家恒温电水壶</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-mjdsh.jpg" />
<span class="textb">米家电水壶</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-pm.jpg" />
<span class="textb">PM2.5检测仪</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-szjcb.jpg" />
<span class="textb">水质TDS检测笔</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-sd.jpg" />
<span class="textb">扫地机器人</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-sdjfj.jpg" />
<span class="textb">扫地机附件</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-dfg.jpg" />
<span class="textb">米家电饭煲</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-dcl.jpg" />
<span class="textb">米家电磁炉</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-cj.jpg" />
<span class="textb">知吾煮厨具</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-tyds.jpg" />
<span class="textb">激光投影电视</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-jsq1a.jpg" />
<span class="textb">小米净水器1A(厨下式)</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jd-txd.jpg" />
<span class="textb">剃须刀</span>
</a>
</li>

</ul>
</div>

<div id="e" class="none site-children site-children-col-7">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sh.jpg" />
<span class="textb">手环</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sb.jpg" />
<span class="textb">手表</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-tzc.jpg" />
<span class="textb">小米体脂秤</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-tzhongc.jpg" />
<span class="textb">小米体重秤</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-twj.jpg" />
<span class="textb">体温计</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-xyj.jpg" />
<span class="textb">米家血压计</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-ddys.jpg" />
<span class="textb">米家电动牙刷</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-jtzh.jpg" />
<span class="textb">智能家庭组合</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-cz.jpg" />
<span class="textb">米家智能插座</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sdt.jpg" />
<span class="textb">手电筒</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-ledtd.jpg" />
<span class="textb">米家LED智能台灯</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-td.jpg" />
<span class="textb">米家飞利浦台灯</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-yd.jpg" />
<span class="textb">米家感应夜灯</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-ctd.jpg" />
<span class="textb">床头灯</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-xdd.jpg" />
<span class="textb">吸顶灯</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-dp.jpg" />
<span class="textb">智能灯泡</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxt.jpg" />
<span class="textb">米家小白智能摄像机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxtyt.jpg" />
<span class="textb">米家智能摄像机云台版</span>
</a>
</li>
</ul>
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxtxf.jpg" />
<span class="textb">小方智能摄像机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxtdf.jpg" />
<span class="textb">大方智能摄像机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxt1080.jpg" />
<span class="textb">米家智能摄像机1080P</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/jj-sxtdz.jpg" />
<span class="textb">小白智能摄像机大众版</span>
</a>
</li>

</ul>
</div>

<div id="f" class="none site-children site-children-col-8">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-phc.jpg" />
<span class="textb">九号平衡车</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-phcplu.jpg" />
<span class="textb">九号平衡车Plus</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-hbc.jpg" />
<span class="textb">米家电动滑板车</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-zxc.jpg" />
<span class="textb">电助力折叠自行车</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-jly.jpg" />
<span class="textb">行车记录仪</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-hsj.jpg" />
<span class="textb">70迈智能后视镜</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-etsb.jpg" />
<span class="textb">米兔儿童手表2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-znjm.jpg" />
<span class="textb">米兔智能积木</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-gsj.jpg" />
<span class="textb">米兔故事机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-jmjqr.jpg" />
<span class="textb">积木机器人</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-dwdh.jpg" />
<span class="textb">米兔定位电话</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-jmgd.jpg" />
<span class="textb">米兔轨道积木</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-wrj.jpg" />
<span class="textb">小米无人机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-djj.jpg" />
<span class="textb">米家对讲机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-xjx.jpg" />
<span class="textb">米家小相机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-xjqj.jpg" />
<span class="textb">米家全景相机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-xjwd.jpg" />
<span class="textb">小蚁微单相机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/et-hsj.jpg" />
<span class="textb">小米米家智能后视镜</span>
</a>
</li>
</ul>

</div>

<div id="g" class="none site-children site-children-col-9">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-3.jpg" />
<span class="textb">小米路由器3</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-3c.jpg" />
<span class="textb">小米路由器3C</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-3g.jpg" />
<span class="textb">小米路由器3G</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-3a.jpg" />
<span class="textb">小米路由器3A</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-pro.jpg" />
<span class="textb">小米路由器Pro</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-hd.jpg" />
<span class="textb">小米路由器HD</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-fdq2.jpg" />
<span class="textb">WiFi放大器2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-fdqpro.jpg" />
<span class="textb">WiFi放大器Pro</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-wifidlm.jpg" />
<span class="textb">WiFi电力猫</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-vr.png" />
<span class="textb">小米VR眼镜</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-wifiss.jpg" />
<span class="textb">随身WiFi
</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-wx.jpg" />
<span class="textb">千兆网线</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-sjbht.jpg" />
<span class="textb">手机保护套</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-sjm.jpg" />
<span class="textb">手机贴膜</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-zpg.jpg" />
<span class="textb">自拍杆</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-sjx.jpg" />
<span class="textb">数据线</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/lyq-cck.jpg" />
<span class="textb">存储卡</span>
</a>
</li>

</ul>

</div>

<div id="h" class="none site-children site-children-col-10">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-2.jpg" />
<span class="textb">新小米移动电源2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-2c.jpg" />
<span class="textb">小米移动电源2C</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-2j.jpg" />
<span class="textb">小米移动电源2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-sdt.jpg" />
<span class="textb">小米随身手电筒</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-bht.jpg" />
<span class="textb">移动电源保护套</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-dc7h.jpg" />
<span class="textb">彩虹电池7号</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-dc5h.jpg" />
<span class="textb">彩虹5号电池（10粒装）</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cdq.jpg" />
<span class="textb">USB充电器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cdqcz.jpg" />
<span class="textb">小米车载充电器</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-fs.jpg" />
<span class="textb">米家随身风扇</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cxbusb.jpg" />
<span class="textb">小米插线板USB版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cxbjc.jpg" />
<span class="textb">米家插线板6位基础版</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cxbcx.jpg" />
<span class="textb">米家插线板3位长线版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/yddy-cxbzn.jpg" />
<span class="textb">米家智能插线板</span>
</a>
</li>

</ul>

</div>

<div id="i" class="none site-children site-children-col-11">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-lyxq.jpg" />
<span class="textb">小米蓝牙项圈耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-bre.jpg" />
<span class="textb">小米双单元半入耳式耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-pro.jpg" />
<span class="textb">小米圈铁耳机 Pro</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-qt.jpg" />
<span class="textb">小米圈铁耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-hs.jpg" />
<span class="textb">小米活塞耳机清新版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-jz.jpg" />
<span class="textb">小米降噪耳机</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-jl.jpg" />
<span class="textb">小米胶囊耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-tds.jpg" />
<span class="textb">小米头戴式耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-lyyd.jpg" />
<span class="textb">小米运动蓝牙耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-lyydmini.jpg" />
<span class="textb">小米运动蓝牙耳机mini</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-ly.jpg" />
<span class="textb">小米蓝牙耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-lyjsq.jpg" />
<span class="textb">小米蓝牙音频接收器</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-tdsqsb.jpg" />
<span class="textb">小米头戴式耳机轻松版</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-ppej.jpg" />
<span class="textb">品牌耳机</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-ai.jpg" />
<span class="textb">小米AI音响</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-xgp.jpg" />
<span class="textb">小米小钢炮蓝牙音响2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-fhyx.jpg" />
<span class="textb">小米方盒子蓝牙音响2</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-lyyx.png" />
<span class="textb">小米蓝牙音响</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-xgp.jpg" />
<span class="textb">小米随身蓝牙音响</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-tyyx.jpg" />
<span class="textb">小米米兔音响</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-yxmini.jpg" />
<span class="textb">小爱音响mini</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/ej-yxds.jpg" />
<span class="textb">小米电视音响</span>
</a>
</li>

</ul>
</div>

<div id="j" class="none site-children site-children-col-12">
<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-lxx.jpg" />
<span class="textb">旅行箱</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-sjb.jpg" />
<span class="textb">双肩包</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-sb.jpg" />
<span class="textb">儿童书包</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-xb.jpg" />
<span class="textb">胸包</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-qb.jpg" />
<span class="textb">钱包</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-slb.jpg" />
<span class="textb">收纳包</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-fs.jpg" />
<span class="textb">服饰</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-ydx.jpg" />
<span class="textb">运动鞋</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-wj.jpg" />
<span class="textb">围巾</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-yj.jpg" />
<span class="textb">眼镜</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-qzb.jpg" />
<span class="textb">米家签字笔</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-wju.jpg" />
<span class="textb">文具</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-bxh.jpg" />
<span class="textb">玻璃保鲜盒</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-zds.jpg" />
<span class="textb">自动折叠伞</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-lsd.jpg" />
<span class="textb">米家 wiha 精修螺丝刀套装</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-wo.jpg" />
<span class="textb">米兔玩偶</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-jm.jpg" />
<span class="textb">米兔磁力积木</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-ys.jpg" />
<span class="textb">牙刷</span>
</a>
</li>
</ul>

<ul class="children-list children-list-col">
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-sf.png" />
<span class="textb">沙发</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-zt.png" />
<span class="textb">枕头</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-bz.png" />
<span class="textb">被子</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-cz.jpg" />
<span class="textb">床垫</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-zz.jpg" />
<span class="textb">针织件套</span>
</a>
</li>
<li>
<a class="link">
<img src="XiaoMi_phto/category_img/sh-sp.jpg" />
<span class="textb">饰品</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li class="nav-item">
<a class="link" id="link1">
<span class="text">小米手机</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container" id="con1">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="images/mix2s320-220white.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>
<div class="flags">
<div class="fiag">新品</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="images/mix2320-220.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="images/note2320x220.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="images/xm6-320.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="images/max2_toubu.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="images/5x-2.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米MIX2S</a>
</div>
<p class="price">3299元起</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">红米</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hongmi-note5.png" />
</a>
</div>
<div class="children_xinhao">
<a>红米Note5</a>
</div>
<p class="price">1099元起</p>
<div class="flags">
<div class="fiag">新品</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hmi-5Plu.png" />

</a>
</div>
<div class="children_xinhao">
<a>红米5Plus</a>
</div>
<p class="price">999元起</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hongmi-5.png" />
</a>
</div>
<div class="children_xinhao">
<a>红米5</a>
</div>
<p class="price">799元起</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hmi-5a.png" />
</a>
</div>
<div class="children_xinhao">
<a>红米5A</a>
</div>
<p class="price">599元起</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hmi-not5a-b.png" />
</a>
</div>
<div class="children_xinhao">
<a>红米Note5A标准版</a>
</div>
<p class="price">669元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/hmi-not5a-g.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>红米Note5A高配版</a>
</div>
<p class="price">899元起</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">电视</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-4S55320-220-.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米电视4S55英寸</a>
</div>
<p class="price">2999元</p>
<div class="flags">
<div class="fiag">新品</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-4A32.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米电视4A32英寸</a>
</div>
<p class="price">999元</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-4A43.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米电视4A43英寸</a>
</div>
<p class="price">1799元</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-4A50.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米电视4A50英寸</a>
</div>
<p class="price">2199元</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-4A-55-320.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米电视4A55英寸</a>
</div>
<p class="price">2699元</p>
<div class="flags">
<div class="fiag">热卖</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/DS-quan.png" />
</a>
</div>
<div class="children_xinhao">
<a>查看全部<br />
小米电视</a>
</div>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">笔记本</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-320x220youxichuantu.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米游戏本15.6"</a>
</div>
<p class="price">5999元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-air12.5.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米笔记本Air12.5"</a>
</div>
<p class="price">3599元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-air13.3.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米笔记本Air13.3"四核增强</a>
</div>
<p class="price">5399元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-air133-du.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米笔记本Air13.3"独显</a>
</div>
<p class="price">5199元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-air133-ji.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米笔记本Air13.3"集显</a>
</div>
<p class="price">4599元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/BJB-pro156.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米笔记本Pro15.6"</a>
</div>
<p class="price">5599元起</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">盒子</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-4.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米盒子4</a>
</div>
<p class="price">349元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-4c.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米盒子4C</a>
</div>
<p class="price">249元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-3s.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米盒子3S</a>
</div>
<p class="price">349元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-3c.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米盒子3C</a>
</div>
<p class="price">249元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-3.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米盒子3增强版</a>
</div>
<p class="price">449元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/HZ-yy.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米家庭影院</a>
</div>
<p class="price">2099元</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">新品</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-twj.png" />
</a>
</div>
<div class="children_xinhao">
<a>米家iHeaith体温计</a>
</div>
<p class="price">129元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-jly.png" />
</a>
</div>
<div class="children_xinhao">
<a>70迈智能记录仪</a>
</div>
<p class="price">199元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-yj.png" />
</a>
</div>
<div class="children_xinhao">
<a>TS太阳镜旅行者款米家定制</a>
</div>
<p class="price">249元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-hl.png" />
</a>
</div>
<div class="children_xinhao">
<a>铜师傅好运铜葫芦</a>
</div>
<p class="price">29元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-dcl.png" />
</a>
</div>
<div class="children_xinhao">
<a>米家电磁炉</a>
</div>
<p class="price">299元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/XP-tg.png" />
</a>
</div>
<div class="children_xinhao">
<a>知吾煮汤锅米家定制</a>
</div>
<p class="price">99元</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">路由器</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-3A.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米路由器 3A</a>
</div>
<p class="price">139元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-HD-Pro.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米路由器 HD/Pro</a>
</div>
<p class="price">499元起</p>
<div class="flags">
<div class="fiag">大容量</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-3G.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米路由器 3G</a>
</div>
<p class="price">249元</p>
<div class="flags">
<div class="fiag">双千兆</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-3.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米路由器 3</a>
</div>
<p class="price">149元</p>
<div class="flags">
<div class="fiag">双频</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-3c.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米路由器 3C</a>
</div>
<p class="price">69元</p>
<div class="flags">
<div class="fiag">包邮</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/LYQ-fdq.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米WiFi放大器 Pro</a>
</div>
<p class="price">79元</p>

</li>
</ul>
</div>
</div>
</li>

<li class="nav-item">
<a class="link">
<span class="text">智能硬件</span>
<span class="arrow"></span>
</a>
<div class="item-children" style="display: none">
<div class="container">
<ul class="children-ul clearfix">
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/ZN-wrj.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>小米无人机</a>
</div>
<p class="price">2999元</p>
<div class="flags">
<div class="fiag">航拍利器</div>
</div>
</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/ZN-jsq.png" />
</a>
</div>
<div class="children_xinhao">
<a>小米净水器</a>
</div>
<p class="price">1499元起</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/ZN-sd.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>米家扫地机器人</a>
</div>
<p class="price">1699元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/ZN-dfb.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>米家压力IH电饭煲</a>
</div>
<p class="price">999元</p>

</li>
<li>
<div class="children_tupian">
<a>
<img src="XiaoMi_phto/header_img/ZN-qb.jpg" />
</a>
</div>
<div class="children_xinhao">
<a>查看全部<br />
智能硬件</a>
</div>

</li>

</ul>
</div>
</div>
</li>
<li class="nav-item">
<a class="link">

<span class="text">服务</span>
</a>

</li>
<li class="nav-item">
<a class="link">

<span class="text">社区</span>
</a>

</li>
</ul>
</div>
<div class="header_search">
<form class="search-form">
<input type="search" class="search-text iconfont icon-icon8"
data-search-config="{'defaultWords':[{'Key':'小米手机6','Rst':29},{'Key':'小米手机5X','Rst':8},{'Key':'红米note 4X','Rst':14},{'Key':'红米手机4X','Rst':9},{'Key':'小米Max 2','Rst':5},{'Key':'小米电视4C','Rst':2},{'Key':'电视32英寸','Rst':1},{'Key':'笔记本pro','Rst':3},{'Key':'空气净化器','Rst':17},{'Key':'净水器','Rst':9}]}" />
<input type="submit" class="search-btn" value="?" />
<div class="search-word">
<a>红米Note 5</a>
<a>小米MIX 2</a>
</div>

<div class="keyword-list hide">
<ul class="result-list">
<li>
<a href="#">小米手机6
<span class="result">约有29件</span>
</a>
</li>
<li>
<a href="#">小米手机5X
<span class="result">约有8件</span>
</a>
</li>
<li>
<a href="#">红米note 4X
<span class="result">约有14件</span>
</a>
</li>
<li>
<a href="#">红米手机4X
<span class="result">约有9件</span>
</a>
</li>
<li>
<a href="#">小米Max 2
<span class="result">约有5件</span>
</a>
</li>
<li>
<a href="#">小米电视4C
<span class="result">约有2件</span>
</a>
</li>
<li>
<a href="#">电视32英寸
<span class="result">约有1件</span>
</a>
</li>
<li>
<a href="#">笔记本Pro
<span class="result">约有3件</span>
</a>
</li>
<li>
<a href="#">空气净化器
<span class="result">约有17件</span>
</a>
</li>
<li>
<a href="#">净水器
<span class="result">约有9件</span>
</a>
</li>

</ul>
</div>
</form>
</div>

</div>
<div class="header-nav-menu" id="j_navMenu">
<div class="container"></div>
</div>
</div>
</body>
</html>

zhao55759013

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
xiaomi

body { font: 12px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif; margin: 0; padding: 0;
复制链接

扫一扫