前天做唯品会的网页,直接导致我积攒了许多天十分膨胀的自信心崩碎成了一片一片的渣渣,div的嵌套并不能处理所有的布局与格式,例如:
<div><div><div><<div></div>/div></div></div>,网页body本身的大小会使得div出现溢出的状况,float等许多标签会直接对div失去作用,并且在格式上,也显得很不流畅,因此,怎样为一个网页布局,怎样避免各种div相互嵌套而导致溢出的情况发生,是制作一个成品网页的重中之重。
今天成功做完了唯品会的网页,现将一部分代码粘贴如下:
<div id="main">
<div class="tou">
<!--网页的上半部分-->
<div class="zuoshang">
<a id="dl" href=""><h1 >唯品会</h1></a>
<a id="xl" href="">一家专门做特卖的网站</a>
</div>
<div class="youshang">
</div>
</div>
<!--网页的中央-->
<div id="mid">
<!-- 左半部分 -->
<div class="left"></div>
<!-- 右半部分 -->
<div class="right">
<div id="xiaozi">
<div class="text1">欢迎注册</div>
<div class="text2">已注册可<a class="fen" href="./denglu.html">直接登录</a></div>
依然是许多的div相互嵌套,但在div中加入class与id,使用外部样式,可以使整个代码页的长度缩短许多,因为很多情况下样式甚至要比body还要多,这样的布局,整个代码页看起来会十分明了,在今后做修改的时候,也会更加的轻松方便。
给密密麻麻的众多div中加入注释,会起到很好的作用。