master

分支 (1)

管理

管理

master

millet
/
index.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="lib/bootstrap-3.3.7-dist/css/bootstrap.css"/>
		<link rel="stylesheet" type="text/css" href="css/xiaomi.css"/>
		<script type="text/javascript" src="lib/jquery/jquery-1.11.1.js" ></script>
		<script type="text/javascript" src="lib/bootstrap-3.3.7-dist/js/bootstrap.js" ></script>
	</head>
	<body>
		<!--红色图片-->
		<div>
			<img src="img/QTS0{15OV$B$J)C8QXL7CGW.png"/>
		</div>
		<!--导航栏开始-->
		<nav class="navbar navbar-inverse ">
		  <div class="container-fluid container">
		    <!-- Brand and toggle get grouped for better mobile display -->
		    <div class="navbar-header">
		      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
		        <span class="sr-only">Toggle navigation</span>
		        <span class="icon-bar"></span>
		        <span class="icon-bar"></span>
		        <span class="icon-bar"></span>
		      </button>
		      <a class="navbar-brand" href="#">小米商城</a>
		    </div>

		    <!-- Collect the nav links, forms, and other content for toggling -->
		    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		      <ul class="nav navbar-nav">
		        <li ><a href="#">MIUI</a></li>
		        <li><a href="#">loT</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>
		        <li><a href="#">Select Region</a></li>
		      </ul>
		      <ul class="nav navbar-nav navbar-right">
		      	<li><a href="#">登陆</a></li>
		      	<li><a href="#">注册</a></li>
		      	<li><a href="#">通知消息</a></li>
		      	<li><a href="#"><i class="iconfont"><img src="img/Snipaste_2018-08-17_19-43-22.png"/></i>购物车</a></li>
		       </ul>
		    </div><!-- /.navbar-collapse -->
		  </div><!-- /.container-fluid -->
		</nav>
		<!--导航栏结束-->
		<div class="container">
			<!--
            	二级导航栏
            -->
			<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		      <ul class="nav navbar-nav">
		        <li class="logo" ><img src="img/Snipaste_2018-08-17_20-08-48.png"/></li>
		        <li><img src="img/Snipaste_2018-08-17_20-22-47.png"/></li>
		        <li><a href="#"><span class="text"><b>小米手机</b></span></a></li>
		        <li><a href="#"><span class="text"><b>红米</b></span></a></li>
		        <li><a href="#"><span class="text"><b>电视</b></span></a></li>
		        <li><a href="#"><span class="text"><b>空调</b></span></a></li>
		        <li><a href="#"><span class="text"><b>新品</b></span></a></li>
		        <li><a href="#"><span class="text"><b>路由器</b></span></a></li>
		        <li><a href="#"><span class="text"><b>智能硬件</b></span></a></li>
		        <li><a href="#"><span class="text"><b>社区</b></span></a></li>
		        <li><a href="#"><span class="text"><b>服务</b></span></a></li>
		      <form class="navbar-form navbar-right">
		        <div class="form-group text">
		          <input type="text" class="form-control" placeholder="小米8 ">
		        </div>
		        <button type="submit" class="btn btn-default"><img src="img/Snipaste_2018-08-17_21-42-01.png"/></button>
		      </form>
		      </ul>
		    </div>
		    <!--
            	二级导航栏结束
            -->
            <!--
            	有列表组的第一行
            -->
            <div class="row">
            	<div class="col-md-3">
            		<div class="list-group">
					  <button type="button" class="list-group-item">手机 电话卡 <span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">电视 盒子<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">笔记本 平板<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">家电 插线板<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">出行 穿戴<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">智能 路由器<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">电源 配件<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">个护 儿童<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">耳机 音箱<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					  <button type="button" class="list-group-item">生活 箱包<span class="glyphicon glyphicon-chevron-right fr"></span></button>
					</div>
            	</div>
            	<div class="col-md-9">
                    <img class="datupian" src="img/Snipaste_2018-08-18_09-18-41.png"/>
            	</div>
            </div>
            	<!--
                	红黄蓝
                -->
            <div style="margin-top: 10px;" >

                <div class="fl">
                	<img  class="daxiao" src="img/Snipaste_2018-08-18_10-33-46.png"/>
                </div>
                <div class="fl">
                	<img  class="sange" src="img/Snipaste_2018-08-18_10-33-56.png"/>
                </div>
                <div class="fl">
                	<img class="sange" src="img/Snipaste_2018-08-18_10-34-01.png"/>
                </div>
                <div class="fl">
                	<img class="sange" src="img/Snipaste_2018-08-18_10-34-09.png"/>
                </div>
                <div class="clear"></div>
            </div>
		<!--
        	小米闪购
        -->
	        <div style="margin-top: 10px;">
	        	<div>
	        		<h3 style="display: inline;">小米闪购</h3>
	        		<input class="fr" type="button"  value=" 〉" />
	        		<input class="fr" type="button"  value="〈  " />
	        	</div>
	        	<div style="margin-top: 10px;">
	        		<div class="fl">
	        			<img class="wuxiongdi" src="img/Snipaste_2018-08-18_13-59-47.png"/>
	        		</div>
	        		<div class="fl">
	        			<img class="wuxiongdi" src="img/Snipaste_2018-08-18_13-59-53.png"/>
	        		</div>
	        		<div class="fl">
	        			<img class="wuxiongdi" src="img/Snipaste_2018-08-18_13-59-58.png"/>
	        		</div>
	        		<div class="fl">
	        			<img class="wuxiongdi" src="img/Snipaste_2018-08-18_14-00-02.png"/>
	        		</div>
	        		<div class="fl">
	        			<img class="wuxiongdi" src="img/Snipaste_2018-08-18_14-00-07.png"/>
	        		</div>
	        		<div class="clear"></div>
	        	</div>
	        </div>
		<!--
        	图片小米8
        -->
        <img style="width: 1125px; margin-top: 10px;" src="img/Snipaste_2018-08-18_14-25-59.png"/>
		</div>
		<div style="background: rgb(245, 245, 245);">
			<div class="container">
				<div  style="margin-top: 20px;">
					<h3 class="inline">手机</h3>
					<h4 class="fr inline">查看全部</h4>
				</div>
				<div>
					<img class="fl" src="img/Snipaste_2018-08-18_14-55-19.png"/>
					<div class="fr"style="width: 900px; height: 614px;">
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-10.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-17.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-23.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-34.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-41.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-47.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-52.png"/></div>
						<div class="fl"><img class="baxiongdi" src="img/Snipaste_2018-08-18_14-57-57.png"/></div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
	</body>
</html>