abstrait：總結(jié)：感覺(jué)自己進(jìn)步很緩慢，是不是需要超多代碼的練習(xí)。?？蠢蠋煹拇a，css都寫(xiě)好幾份，有的還覆蓋掉之前的樣式，感覺(jué)自己看的有點(diǎn)吃力。還是要加油啊。代碼：HTML：<!DOCTYPE html><html><head> <meta charset="utf-8">
總結(jié)：感覺(jué)自己進(jìn)步很緩慢，是不是需要超多代碼的練習(xí)。。
看老師的代碼，css都寫(xiě)好幾份，有的還覆蓋掉之前的樣式，感覺(jué)自己看的有點(diǎn)吃力。
還是要加油啊。
代碼：
HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小米商城</title>
<link rel="shortcut icon" type="image/x-icon" href="static/images/footlogo.png">
<link rel="stylesheet" type="text/css" href="static/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="static/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="static/css/style.css">
<script type="text/javascript" src="static/layui/layui.js"></script>
</head>
<body>
<!-- 頭部 -->
<div class="header">
<div class="menu">
<div class="header-left">
<ul>
<li><a href="">小米商城</a><span>|</span></li>
<li><a href="">MIUI</a><span>|</span></li>
<li><a href="">IOT</a><span>|</span></li>
<li><a href="">云服務(wù)</a><span>|</span></li>
<li><a href="">小愛(ài)分享平臺(tái)</a><span>|</span></li>
<li><a href="">金融</a><span>|</span></li>
<li><a href="">有品</a><span>|</span></li>
<li><a href="">企業(yè)服務(wù)</a><span>|</span></li>
<li><a href="">SelectRegion</a><span>|</span></li>
</ul>
</div>
<div class="header-right">
<ul>
<li class="header-li"><a href="#">登錄</a><span>|</span></li>
<li class="header-li"><a href="#">注冊(cè)</a><span>|</span></li>
<li class="header-li"><a href="shop/order.html">消息通知</a></li>
<li class="header-right-li">
<a href="shop/cart.html"><i class="fa fa-shopping-cart"></i> 購(gòu)物車(chē)(0)</a>
<div>購(gòu)物車(chē)中還沒(méi)有商品，趕緊選購(gòu)吧！</div>
</li>
</ul>
</div>
</div>
</div>
<!-- 主體部分 -->
<div class="contents">
<div class="content">
<div class="content-menu">
<div class="content-menu-pic">
<img src="static/images/footlogo.png" alt="" style="margin:5px 0px; margin-right:10px;">
<img src="static/images/logoAD.gif" alt="">
</div>
<ul class="content-menu-ul">
<li >小米手機(jī)
<div class="mi-phone">
<div class="mi-phone-div">
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
</div>
</div>
</li>
<li>紅米
<div class="mi-phone">
<div class="mi-phone-div">
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</div>
<div class="mi-phone1-shop">
<img src="static/images/phone/phone1.png" alt="">
<br>
<a href="">小米2S</a>
<br>
<a href="" style="color:#ff6700;">3299 元</a>
</div>
</div>
<span></span>
<div class="mi-phone1">
<div class="new">新品</
Professeur correcteur：西門(mén)大官人Temps de correction：2019-03-03 10:12:47
Résumé du professeur：多練習(xí)，不需要貪多貪大，小案例往往能更好的幫助你理解。等各種布局小案例熟練后，再來(lái)幾個(gè)大的案例就不會(huì)手忙腳亂了