花了一天的时间给粉丝做了一个小米官网（高仿）
Posted 孙叫兽
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了花了一天的时间给粉丝做了一个小米官网（高仿）相关的知识，希望对你有一定的参考价值。
身为前端程序员，经常会找几个官网试试手，哈哈，这次拿小米官网试试手吧。
目录
效果图：
项目结构
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>小米官网</title>
<link rel ="stylesheet" type="text/css" href="css/reset.css"/>
<link rel="stylesheet" type="text/css" href="css/usual.css">
<link rel = "stylesheet" type ="text/css" href ="css/index.css"/>
<link rel ="stylesheet" type="text/css" href="css/font-awesome.min.css"/>
<link rel ="stylesheet" type="text/css" href="fonts/iconfont.css"/>
<script type ="text/javascript" src = "js/jquery-3.2.1.js"></script>
<script type ="text/javascript" src = "js/slide.js"></script>
<script type ="text/javascript" src = "js/xm-star.js"></script>
<script type ="text/javascript" src = "js/main-page.js"></script>
</head>
<body>
<!--header start-->
<header>
<!--头部新产品广告-->
<div class="h-top-bg">
<a href="#"></a>
</div>
<!--头部快捷导航-->
<div class="h-bar">
<div class="wrap clearFix">
<div class="h-l fl">
<ul class = "nav">
<li><a href="#" target="_blank">小米商城</a></li>
<li>|</li>
<li><a href="#" target="_blank">MIUI</a></li>
<li>|</li>
<li><a href="#" target="_blank">米聊</a></li>
<li>|</li>
<li><a href="#" target="_blank">游戏</a></li>
<li>|</li>
<li><a href="#" target="_blank">多看阅读</a></li>
<li>|</li>
<li><a href="#" target="_blank">云服务</a></li>
<li>|</li>
<li><a href="#" target="_blank">金融</a></li>
<li>|</li>
<li><a href="#" target="_blank">小米商城移动版</a></li>
<li>|</li>
<li><a href="#" target="_blank">问题反馈</a></li>
<li>|</li>
<li>
<a href="">Select Region</a>
<div class="cover">
<div class="modal">
<div class="title"></div>
</div>
</div>
</li>
</ul>
</div>
<div class="h-r fr">
<div class="s-cart fr">
<a href="#" target = "_blank">
<i class="iconfont icon-gouwuche1"></i>
购物车 <span>( 0 )</span>
</a>
<div class="s-info">
</div>
</div>
<ul class = "nav fr">
<li><a href="#" target = "_blank">登录</a></li>
<li>|</li>
<li><a href="#" target ="_blank">注册</a></li>
<li>|</li>
<li><a href="" target ="_black">消息通知</a></li>
</ul>
</div>
</div>
</div>
<a href="javascript:;">
<img src="images/home-elect/xmad_14951679051921_JWQpV.jpg" alt="#" width="234" height="300">
</a>
</div>
<div class="b-right span16 fr">
<ul class ="brick-list brick-list-hot active clearFix">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077454.46128587!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 49英寸</a></h2>
<p class="small">6月1日-3日,下单立减300</p>
<p class="price">2599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1469583247.6157588!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 13.3英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">4999元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490604824.19051012!220x220.jpg" alt="#" width="150" height="150">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490604824.19051012!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 12.5英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">3599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<div class="sub-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490770630.65576964!220x220.png" alt="#" width="80" height="80">
</a>
<h2 class="pro-name"><a href="javascript:;">米家IH电饭煲 4L</a></h2>
<p class="price">2099元</p>
</div>
<div class="sub-item">
<a href="javascript:;" class="icon">
<i class="iconfont icon-jiantou5"></i>
</a>
<a href="javascript:;" class="more-link">
浏览更多
<small >热门</small>
</a>
</div>
</li>
</ul>
<ul class ="brick-list brick-list-hot clearFix">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1474944620.67265595!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视3s 55英寸</a></h2>
<p class="small">6月1日-3日,直降400元</p>
<p class="price">3599元 <s>3999元</s></p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077569.08131612!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 65英寸</a></h2>
<p class="small">6月1日-3日,下单立减1000</p>
<p class="price">5699元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490778061.59475600!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">电视4A 49英寸人工智能语音版</a></h2>
<p class="small">6月1日~3日，下单立减200元</p>
<p class="price">2899元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490778355.67093197!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 12.5英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">3599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1479190789.95594557!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米盒子3s</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">299元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<div class="sub-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490770630.65576964!220x220.png" alt="#" width="80" height="80">
</a>
<h2 class="pro-name"><a href="javascript:;">米家IH电饭煲 4L</a></h2>
<p class="price">2099元</p>
</div>
<div class="sub-item">
<a href="javascript:;" class="icon">
<i class="iconfont icon-jiantou5"></i>
</a>
<a href="javascript:;" class="more-link">
浏览更多
<small >热门</small>
</a>
</div>
</li>
</ul>
<ul class ="brick-list brick-list-hot clearFix">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077454.46128587!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 49英寸</a></h2>
<p class="small">6月1日-3日,下单立减300</p>
<p class="price">2599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1478763592.13343555!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 13.3英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">4999元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490702347.3628109!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 12.5英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">3599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490595812.95661863!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<div class="sub-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490770630.65576964!220x220.png" alt="#" width="80" height="80">
</a>
<h2 class="pro-name"><a href="javascript:;">米家IH电饭煲 4L</a></h2>
<p class="price">2099元</p>
</div>
<div class="sub-item">
<a href="javascript:;" class="icon">
<i class="iconfont icon-jiantou5"></i>
</a>
<a href="javascript:;" class="more-link">
浏览更多
<small >热门</small>
</a>
</div>
</li>
</ul>
<ul class ="brick-list brick-list-hot clearFix">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1478678718.61531371!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1478678718.61531371!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 49英寸</a></h2>
<p class="small">6月1日-3日,下单立减300</p>
<p class="price">2599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/T1vJE_Bv_T1RXrhCrK!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 13.3英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">4999元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490604824.19051012!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 12.5英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">3599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490077058.71391368!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490756071.3088664!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<div class="sub-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490770630.65576964!220x220.png" alt="#" width="80" height="80">
</a>
<h2 class="pro-name"><a href="javascript:;">米家IH电饭煲 4L</a></h2>
<p class="price">2099元</p>
</div>
<div class="sub-item">
<a href="javascript:;" class="icon">
<i class="iconfont icon-jiantou5"></i>
</a>
<a href="javascript:;" class="more-link">
浏览更多
<small >热门</small>
</a>
</div>
</li>
</ul>
<ul class ="brick-list brick-list-hot clearFix">
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/T1RRCjBKJv1RXrhCrK.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/T1RRCjBKJv1RXrhCrK.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 49英寸</a></h2>
<p class="small">6月1日-3日,下单立减300</p>
<p class="price">2599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1469429887.76894954!220x220.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 13.3英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">4999元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/T1G9Y_BmCv1RXrhCrK.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米笔记本Air 12.5英寸</a></h2>
<p class="small">独立显卡，全金属机身，超长续航</p>
<p class="price">3599元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/6ddc1df6-ce8e-4cb5-a26a-b5ef80f1adf7.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/6ddc1df6-ce8e-4cb5-a26a-b5ef80f1adf7.jpg" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会...
</p>
<p class="author">
来自于 zk 的评价
</p>
</div>
</li>
<li class="brick-item">
<a href="javascript:;" class="img">
<img src="images/home-elect/pms_1490756071.3088664!220x220.png" alt="#" width="150" height="150">
</a>
<h2 class="pro-name"><a href="javascript:;">小米电视4A 43英寸</a></h2>
<p class="small">6月1日-3日,限量送儿童会员年卡</p>
<p class="price">2099元</p>
<div class="flag">享9.8折</div>
<div class="review">
<p class="content">
速度很快，外观漂亮，分量很足！ 每次开机黄灯都亮一会..以上是关于花了一天的时间给粉丝做了一个小米官网（高仿）的主要内容，如果未能解决你的问题，请参考以下文章