admin管理员组文章数量:1566352
效果图
分为三部分
一:css
1.content
ul { list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight: normal; }
/*大导航下面的六个小css块样式*/
.content-picli_1 li { width: 33%; height: 60px; color: #ccc; font-size: 14px; float: left; text-align: center; margin-top: 20px; }
.content-picli_1 li span { width: 100%; height: 30px; float: left; text-align: center; }
.content-picli_1 li:hover { color: #eee; }
/*重写二级标题样式,包括小米闪购和下面的一堆二级标题*/
.content-picshop h2,
.content-bottom h2 { height: 56px; line-height: 50px; font-size: 22px; padding-top: 20px; margin: 0; font-weight: 300; }
.content-bottom h2 .tab { float: right; color: #424242; font-size: 16px; font-weight: normal; line-height: 60px; }
/*优化长广告 覆盖mi.css*/
.content-bottom2_pic,
.content-bottom3_pic,
.content-bottom7_pic { margin-top: 40px; }
/*小米闪购*/
/*重写height和padding-top 覆盖mi.css*/
.content-picshop3,
.content-picshop4,
.content-picshop5,
.content-picshop6,
.content-picshop7 { border-top: 1px solid; padding-top: 40px; height: 300px; background-color: #fff; position: relative; }
.content-picshop4,
.content-picshop5,
.content-picshop6,
.content-picshop7 { color: #333; }
/*浅灰色背景*/
.bg { background-color: rgba(0, 0, 0, 0.02); width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
/*闪购倒计时*/
.content-picshop3 { border-color: #e53935; background-color: #f1eded; }
.content-picshop3 div { width: 100%; text-align: center; }
.content-picshop3 .time { font-size: 24px; color: #ef3a3b; margin-top: 15px; }
.content-picshop3 .flash { height: 64px; margin: 25px 0; }
.content-picshop3 .detail { line-height: 22px; color: rgba(0, 0, 0, 0.54); font-size: 15px; }
.content-picshop3 .clock { color: #605751; font-size: 24px; line-height: 46px; margin-top: 30px; }
.clock .hour,
.clock .minute,
.clock .second { display: inline-block; background-color: #605751; width: 46px; height: 46px; color: #fff; }
/*闪购item*/
.content-picshop4 { border-color: #ffac13; }
.content-picshop5 { border-color: #83c44e; }
.content-picshop6 { border-color: #2196f3; }
.content-picshop7 { border-color: #e53935; }
.picshopImg { width: 160px; height: 160px; margin: 0 38px 22px; }
.picshopTitle { width: 100%; font-size: 14px; margin: 0 3px; -ms-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-align: center; }
.picshopDesc { width: 100%; font-size: 12px; color: #b0b0b0; text-align: center; margin: 8px 0 12px; -ms-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.picshopPrice { width: 100%; text-align: center;font-size: 13px; color: #b0b0b0; }
2:footer
dl,dd,dt{
list-style: none;
padding:0;
margin:0;
}
/*底部top*/
.footer-top_li_a dl{
display: block;
float: left;
width: 160px;
}
.footer-top_li_a dt{
font-size: 14px;
line-height:14px;
color:#424242;
margin-bottom:26px;
}
.footer-top_li_a dd{
height: 18px;
font-size: 12px;
line-height: 18px;
margin-top: 10px;
}
.footer-top_li_a dd a{
color: #757575;
}
.footer-top_li_a dd a:hover{
color:#ff6700;
}
.footer-top_li_a .connect{
float: right;
width:258px;
height: 112px;
border-left: 1px solid #e0e0e0;
text-align: center;
}
.connect .telephone{
color: #ff6700;
margin: 0 0 5px;
font-size: 22px;
line-height: 22px;
}
.connect .time{
color:#616161;
margin:0 0 16px;
font-size: 12px;
}
.connect button{
width: 118px;
height: 28px;
font-size: 12px;
line-height: 28px;
border:1px solid #ff6700;
color: #ff6700;
background-color: #fff;
}
.connect button:hover{
background-color: #ff6700;
color: #fff;
}
/*底部bottom*/
.footer-bottom_li_1,.footer-bottom_li_2,.footer-bottom_li_3{
float: left;
margin-right: 10px;
}
.footer-bottom_li_4{
clear: left;
margin-top: 15px;
width:1226px;
text-align: center;
font-family: "楷体";
font-size: 24px;
color: #ccc;
}
.footer-bottom_li_a{
height:19px;
width: 640px;
}
.footer-bottom_li_a li{
height:19px;
font-size: 12px;
float: left;
color: #757575;
}
.footer-bottom_li_a li span{
width:0px;
height:10px;
border-left: 1px solid #b0b0b0;
margin:3px 3px;
}
.footer-bottom_li_a li:hover{
color:#ef3a3b;
}
.footer-bottom_li_b{
width:640px;
color: #b0b0b0;
font-size: 12px;
}
.footer-bottom_li_b a{
color:#b0b0b0;
}
.footer-bottom_li_b a:hover{
color:#ef3a3b;
}
.footer-bottom_li_3 {
float: right;
}
.footer-bottom_li_3 img{
display:block;
width:83px;
float: left;
margin-right: 10px;
}
3:mi
*{margin: 0px;padding: 0px;border: none;}
.clear{clear: both;}
li{list-style: none;}
a{text-decoration: none;color: #fff;}
/*头部*/
.header{height: 40px;width: 100%;background: #333;}
.header_menu{width: 1226px;height: 40px; margin:0px auto;}
.header_menu span{margin: 0px 10px;color: #6C6D69;}
.header_menu li a:hover{color: #FFF;}
.header_left{float: left;line-height: 40px;}
.header_left li{color:#ccc;float: left;font-size: 9px;}
.header_right{float: right;height: 40px;line-height: 40px; }
.header_right li{float: left;height: 40px;}
.header_right li a{color:#aaa;font-size:12px; }
.header_right li a:hover{color: #fff;}
.header_right li span{color:#424242;font-size:12px;margin: 0px 5px; }
.header_right_li{width: 120px;height: 40px; text-align:center;background:#424242;color:#aaa;font-size:12px;position: relative;margin-left:10px; }
.header_right_li:hover{color:#FF6A00; background: #fff;}
.header_right_li div{width: 300px;height: 90px;background: #fff;position: absolute;right: 0px;display: none;color: #ccc;z-index: 2;}
.header_right_li:hover div{display: block;}
/*主体内容上*/
.content-top{}
.content{width:1226px;margin: 0 auto; }
/*导航*/
.content_menu{width:1226px;height: 66px;margin: 10px 0px;}
/*导航2*/
.content_menu_pic{float: left;}
.content_menu_ul{float: left;height: 66px;line-height:66px; margin-left: 15px;/*position: relative;*/}
.content_menu_ul li{float: left; margin-right: 10px;font-size: 17px;}
.content_menu_ul li:hover{color:#FF6A00;}
.content-form{position: relative; float: right;width: 314px;height: 63px;padding: 6px 0px;}
.content-form input[type="text"]{width: 250px;height: 50px;float: left;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-bottom:1px solid #ccc;}
.content-form .botton{width: 60px;height: 50px;float: left;border: 1px solid #ccc;}
.content-form .content-form-a{position: absolute;top: 20px;right: 75px; width: 110px;}
.content-form a {color: #aaa;width: 50px;font-size: 7px;background: #EBEBEB;padding: 3px;}
.content-form a:hover {background:#FF6700;color: #fff;}
.content-form i{position: absolute;top: 20px;right: 25px;font-size: 21px;color: #424242;}
.content-form .botton:hover{border: none;width: 62px;height: 52px; background:#FF6700;color:#fff;}
.content-form .botton:hover i{color:#fff;}
/*下拉*/
.mi_phone{width:100%;height:230px;border-bottom: 1px solid #ccc; border-top: 1px solid #ccc;position:absolute;left: 0px;z-index: 2; background: #fff;display: none;}
.content_menu_ul li:hover .mi_phone{display: block;}
.mi_phone_div .mi_phone_shop{width: 120px; height: 160px;margin-top: 30px;line-height: 30px;}
.mi_phone_div{width: 1226px;height: 230px;margin:0px auto;}
.mi_phone_div_1{margin:0px auto;/*border: 1px solid red;*/padding:0px 50px;}
.mi_phone_div a{color: #000;font-size: 9px;/*margin-left: 15px;*/}
.mi_phone_div span{border-right: 1px solid #ccc;margin:0px 30px;margin-top: 30px;height: 80px;width: 0px;float: left;}
.new{width: 60px;height: 18px;font-size: 9px;position: absolute;top:0px;left:25px; border: 1px solid #FF6A00;color:#FF6A00; line-height: 18px;text-align: center;}
.mi_phone_div .mi_phone1{float: left;width: 181px;height:230px; position: relative;text-align: center;}
.mi_phone_shop {float: left}
/*左边导航*/
.content_pic{width: 1226px;height:460px;background:url(../img/mi.jpg) ;}
.content_pic_menu{width: 246px;height:460px; float: left;background: #424242;position: relative; }
.content_pic_img{width: 980px;height:460px;float: right; }
.content_pic_ul{width: 246px;height: 440px; margin:30px 0px;}
.content_pic_ul li{width: 246px;height: 40px;line-height: 40px;font-size:15px;color: #fff;}
.content_pic_ul li i{font-size: 15px;font-weight: bold;float: right;margin-right:20px;margin-top: 13px;}
.content_pic_ul li a{margin-left: 20px;}
.content_pic_ul li:hover{background:#FF6A00; }
.content_pic_div{height: 460px;width:900px;background: #fff;position: absolute;top: 0px; left:235px;display: none;}
.content_pic_ul li:hover .content_pic_div {display: block;}
.content_div_menu{width:880px; height:440px;margin: 10px 10px; }
.content_div_1{width: 880px;height:70px; margin-top: 5px;}
.content_div_1 div{width: 280px;float: left;height:70px;/*border: 1px solid #ccc;*/margin-right: 10px;}
.content_div_1 div img{width:40px;height: 40px;margin: 15px 0px;float: left;}
.content_div_1 div a{color:#000;float: left;margin-top: 17px;}
.content_div_1 div:hover a{color:#FF6A00;}
/*
小米闪购*/
.content-picli{height: 170px;width:1226px;margin-top: 10px;}
.content-picli_1{height: 170px;width: 235px; float: left;background:#5F5750;margin-right: 14.3px;}
.content-picli_2{height: 170px;width: 316px;float: left;background:url(../img/midAD1.jpg);margin-right:14.3px;}
.content-picli_3{height: 170px;width: 316px;float: left;background:url(../img/midAD2.jpg);margin-right: 14.3px;}
.content-picli_4{height: 170px;width: 316px;float: left;background:url(../img/midAD3.jpg);}
.content-picshop1{height: 50px;width:1226px; }
.content-picshop2{height: 340px;width:1226px; }
.content-picshop3{float: left;height: 340px;width:235px; background:#ccc;margin-right:12.7px;}
.content-picshop4{float: left;height: 340px;width:235px; background:#ccc;margin-right:12.7px;}
.content-picshop5{float: left;height: 340px;width:235px; background:#ccc;margin-right:12.7px;}
.content-picshop6{float: left;height: 340px;width:235px; background:#ccc;margin-right:12.7px;}
.content-picshop7{float: left;height: 340px;width:235px; background:#ccc;}
.content-pic{height: 119px;width: 1226px;background: url(../img/longAD1.jpg);margin: 40px 0px;}
/*底部*/
.footer-top{}
.footer-top_li{width: 1226px;margin: 0px auto;}
.footer-top_li_1{width: 1126px;height: 80px;margin: 0px auto;line-height: 80px;}
.footer-top_li_1 a{color:#616161;font-size: 16px; font-weight: 300;}
.footer-top_li_1 a:hover{color:#FF6700;}
.footer-top_li_1 a i{margin-right: 10px;font-size: 20px;}
.footer-top_li_1 span{color:#616161;margin:0 56px;font-size: 20px;border-left: 1px solid #e0e0e0;}
.footer-top_li .separate{display:block;width: 1226px;height:0;border-bottom: 1px solid #e0e0e0;}
.footer-top_li_2 {width: 1226px;height: 100px;border:0;padding:40px 0;}
.footer-top_li_2
.footer-bottom{height:100px; background:#F5F5F5;}
.footer-bottom_li{width: 1226px;margin: 0px auto;}
二:图片
三:js
<!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="shortcut icon" type="image/x-icon" href="img/logo.png" />
<link rel="stylesheet" type="text/css" href="css/mi.css">
<link rel="stylesheet" type="text/css" href="css/content.css">
<link rel="stylesheet" type="text/css" href="css/footer.css">
</head>
<body>
<div class="box">
<!-- 头部 -->
<div class="header">
<div class="header_menu">
<ul class="header_left">
<li><a>小米商城</a><span>|</span></li>
<li><a>MIUI</a><span>|</span></li>
<li><a>IOT</a><span>|</span></li>
<li><a>云服务</a><span>|</span></li>
<li><a>小爱分享平台</a><span>|</span></li>
<li><a>金融</a><span>|</span></li>
<li><a>有品</a><span>|</span></li>
<li><a>企业服务</a><span>|</span></li>
<li><a>SelectRegion</a></li>
</ul>
<div class="header_right">
<ul>
<li><a>登录</a><span>|</span></li>
<li><a>注册</a><span>|</span></li>
<li><a>消息通知</a></li>
<li class="header_right_li"><i class="fa fa-shopping-cart" ></i> 购物车 ( 0 )
<div>购物车中还没有商品,赶紧选购吧!</div>
</li>
</ul>
</div>
</div>
</div>
<!-- 主体内容上半部分 -->
<div class="content-top">
<div class="content">
<div class="content_menu">
<div class="content_menu_pic">
<img src="img/logo.png" class="content_menu_img"style="margin: 5px 0px;margin-right: 10px;">
</div>
<div class="content_menu_ul">
<ul>
<li>小米手机</li>
<li>红米</li>
<li>电视</li>
<li>笔记本</li>
<li>盒子</li>
<li>新品</li>
<li>路由器</li>
<li>智能硬件</li>
<li>服务</li>
<li>社区</li>
</ul>
</div>
<div class="content-form">
<form>
<input type="text" name="">
<div class="content-form-a"><a href="">电视新品</a> <a href="">618预热</a></div>
<div class="botton"><i class=" fa fa-search"></i></div>
</form>
</div>
<div class="clear"></div>
</div>
<div class="content_pic">
<div class="content_pic_menu">
<ul class="content_pic_ul">
<li><a href="">手机 电话卡 </a><i class="fa fa-angle-right"></i>
</li>
<li><a href="">电视机 盒子</a><i class="fa fa-angle-right"></i></li>
<li><a href="">笔记本 </a><i class="fa fa-angle-right"></i>
</li>
<li><a href="">智能 家电 </a><i class="fa fa-angle-right"></i></li>
<li><a href="">健康 家居 </a><i class="fa fa-angle-right"></i></li>
<li><a href="">出行 儿童 </a><i class="fa fa-angle-right"></i></li>
<li><a href="">路由器 手机配件 </a><i class="fa fa-angle-right"></i></li>
<li><a href="">移动电源 插线板</a><i class="fa fa-angle-right"></i></li>
<li><a href="">耳机 音箱 </a><i class="fa fa-angle-right"></i></li>
<li><a href="">生活 米兔</a> <i class="fa fa-angle-right"></i></li>
</ul>
</div>
<div class="content_pic_img"><img src="img\滚动栏.png" alt=""></div>
<div class="clear"></div>
</div>
<!-- 以下部分样式见 外部样式 content.css -->
<!--xin start-->
<!--一个小导航+三个小广告-->
<div class="content-picli">
<div class="content-picli_1">
<ul>
<li><span class="fa fa-mobile-phone fa-2x"></span>选购手机</li>
<li><span class="fa fa-gift fa-2x"></span>企业团购</li>
<li><span class="fa fa-facebook fa-2x"></span>F码通道</li>
<li><span class="fa fa-file-text fa-2x"></span>米粉卡</li>
<li><span class="fa fa-refresh fa-2x"></span>以旧换新</li>
<li><span class="fa fa-credit-card fa-2x"></span>话费充值</li>
</ul>
</div>
<div class="content-picli_2"><img src="img\1.png" alt=""></div>
<div class="content-picli_3"><img src="img\2.png" alt=""></div>
<div class="content-picli_4"><img src="img\3.png" alt=""></div>
</div>
<div class="clear"></div>
<!--小米闪购-->
<div class="content-picshop">
<h2 class="content-picshop1">小米闪购</h2>
<div class="content-picshop2">
<div class="content-picshop3">
<div class="time">18:00 场</div>
<div class="flash fa fa-flash fa-4x" style="color: #ef3a3b;"></div>
<div class="detail">距离开始还有</div>
<div class="clock">
<span class="hour">00</span>
<span class="maohao">:</span>
<span class="minute">00</span>
<span class="maohao">:</span>
<span class="second">00</span>
</div>
<div class="bg"></div>
</div>
<div class="content-picshop4">
<img class="picshopImg" src="img\洗衣机.jpg" alt="">
<h3 class="picshopTitle">米家滚筒洗衣机 白色</h3>
<p class="picshopDesc">直驱电机更安静</p>
<p class="picshopPrice">
<span style="color:#ff6709">1399 元</span>
<del>1499元</del>
</p>
<div class="bg"></div>
</div>
<div class="content-picshop5">
<img class="picshopImg" src="img\手环.jpg" alt="">
<h3 class="picshopTitle">小米手环 2 黑色</h3>
<p class="picshopDesc">OLED 显示屏,触摸操作</p>
<p class="picshopPrice">
<span style="color:#ff6709">142 元</span>
<del>149元</del>
</p>
<div class="bg"></div>
</div>
<div class="content-picshop6">
<img class="picshopImg" src="img\扫地机器人.jpg" alt="">
<h3 class="picshopTitle">米家扫地机器人2 白色</h3>
<p class="picshopDesc">够快才够净</p>
<p class="picshopPrice">
<span style="color:#ff6709">1709 元</span>
<del>1799元</del>
</p>
<div class="bg"></div>
</div>
<div class="content-picshop7">
<img class="picshopImg" src="img\净水器.jpg" alt="">
<h3 class="picshopTitle">小米净水器 白色 1200G</h3>
<p class="picshopDesc">3秒一杯纯水</p>
<p class="picshopPrice">
<span style="color:#ff6709">189 元</span>
<del>199元</del>
</p>
<div class="bg"></div>
</div>
</div>
</div>
<div class="content-pic"></div>
</div>
</div>
<!-- 网页底部 -->
<div class="footer-top">
<div class="footer-top_li">
<div class="footer-top_li_1">
<a href="#"><i class="fa fa-wrench"></i>预约维修服务</a><span></span>
<a href="#"><i class="fa fa-rotate-right "></i>7天无理由退货</a><span></span>
<a href="#"><i class="fa fa-refresh"></i>15天免费换货</a><span></span>
<a href="#"><i class="fa fa-gift"></i>满150元包邮</a><span></span>
<a href="#"><i class="fa fa-map-marker"></i>520余家售后网点</a>
</div>
<span class="separate"></span>
<div class="footer-top_li_2">
<div class="footer-top_li_a">
<dl>
<dt>帮助中心</dt>
<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>
</dl>
<dl>
<dt>线下门店</dt>
<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>
</dl>
<dl>
<dt>关注我们</dt>
<dd><a href="">新浪微博</a></dd>
<dd><a href="">官网微博</a></dd>
<dd><a href="">联系我们</a></dd>
</dl>
<dl>
<dt>特色服务</dt>
<dd><a href="">F码通道</a></dd>
<dd><a href="">礼物码</a></dd>
<dd><a href="">防伪查询</a></dd>
</dl>
<div class="connect">
<p class="telephone">Feir-520-1314</p>
<p class="time">周一至周日 8:00-18:00<br>(仅收市话费)</p>
<button><span class="fa fa-commenting "></span> 联系客服</button>
</div>
</div>
<div class="footer-top_li_b"></div>
</div>
</div>
</div>
<div class="footer-bottom">
<div class="footer-bottom_li">
<div class="footer-bottom_li_1">
<img src="img/logo.png" alt="" class="logoBottom">
</div>
<div class="footer-bottom_li_2">
<div class="footer-bottom_li_a">
<ul>
<li>小米商城<span></span></li>
<li>MIUI<span></span></li>
<li>米家<span></span></li>
<li>米聊<span></span></li>
<li>多看<span></span></li>
<li>游戏<span></span></li>
<li>路由器<span></span></li>
<li>米粉卡<span></span></li>
<li>政企服务<span></span></li>
<li>小米天猫店<span></span></li>
<li>隐私政策<span></span></li>
<li>问题反馈<span></span></li>
<li>Select Region</li>
</ul>
</div>
<div class="footer-bottom_li_b">
<a href="">©mi</a>
京ICP证110507号
<a href="">京ICP备10046444号</a>
<a href="">京公网安备11010802020134号</a>
<a href="">京网文[2014]0059-0009号</a>
<br>
违法和不良信息举报电话:185-0130-1238,本网站所列数据,除特殊说明,所有数据均出自我司实验室测试
</div>
</div>
<div class="footer-bottom_li_3">
<img src="img/logo.png" alt="" class="icon">
<img src="img/logo.png" alt="" class="icon">
<img src="img/logo.png" alt="" class="icon">
<img src="img/logo.png" alt="" class="icon">
<img src="img/logo.png" alt="" class="icon">
</div>
<div class="footer-bottom_li_4">
探索黑科技,小米为发烧而生!
</div>
</div>
</div>
</div>
<div class="mi_phone">
<div class="mi_phone_div">
<div class="mi_phone_div_1">
<div class="mi_phone1">
<div class="new">新品</div>
<div class="mi_phone_shop">
<img src="img/phone1.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
<span></span>
</div>
<div class="mi_phone1">
<div class="new">新品</div>
<div class="mi_phone_shop">
<img src="img/phone2.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
<span></span>
</div>
<div class="mi_phone1">
<div class="new">新品</div>
<div class="mi_phone_shop">
<img src="img/phone3.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
<span></span>
</div>
<div class="mi_phone1">
<div class="new">新品</div>
<div class="mi_phone_shop">
<img src="img/phone1.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
<span></span>
</div>
<div class="mi_phone1">
<!-- <div class="new">新品</div> -->
<div class="mi_phone_shop">
<img src="img/phone1.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
<span></span>
</div>
<div class="mi_phone1">
<!-- <div class="new">新品</div> -->
<div class="mi_phone_shop">
<img src="img/phone1.png">
<br>
<a href="">小米2s</a>
<br>
<a href="" style="color:#FF6A00;">3299元</a>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div class="content_pic_div">
<div class="content_div_menu">
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
<div class="content_div_1">
<div><img src="img/phone1.png"> <a href="">小米8</a></div>
<div><img src="img/phone2.png"> <a href="">小米MIX2</a></div>
<div><img src="img/phone4.jpg"> <a href="">移动4G+专区</a></div>
</div>
</div>
</div>
</body>
</html>
版权声明:本文标题:小米商城界面 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://www.elefans.com/dongtai/1726414202a1069608.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论