唐山網(wǎng)站建設(shè),唐山網(wǎng)站制作,唐山做網(wǎng)站,唐山網(wǎng)頁(yè)設(shè)計(jì),唐山網(wǎng)站優(yōu)化,唐山網(wǎng)絡(luò)公司,唐山400電話業(yè)務(wù) 24小時(shí)熱線：15031560143 關(guān)于我們 | 網(wǎng)站模版 | 支付方式 | 網(wǎng)站地圖
今天做一個(gè)網(wǎng)站時(shí)，首頁(yè)即將收尾，做到了導(dǎo)航菜單模塊，但是在實(shí)現(xiàn)子元素UL距離父元素div#links時(shí)，遇到了 margin-top設(shè)置無(wú)效的現(xiàn)象。
html代碼：
<div id="links">
<ul>
<li><a href=http://www.90focus.com>90focus前端技術(shù)學(xué)習(xí)</a></li>
<li><a href=http://www.90focus.com>90focus前端技術(shù)學(xué)習(xí)</a></li>
...
<div class="clear"></div>
</ul>
</div>
CSS代碼：
#links{height:105px; background:url(../images/linkbg.gif) no-repeat; margin-top:10px;}
#links ul{ display:block; width:905px; margin-left:40px; margin-top:10px;}
#links ul li{ display:inline-block; width:100px; text-align:center; line-height:30px; float:left}
但是發(fā)現(xiàn)無(wú)論怎樣修改ul的margin數(shù)制都沒(méi)有作用，在網(wǎng)上查了一下原因，有人說(shuō)是“margin疊加bug”。有幾個(gè)解決方法：
1.在父元素加上有意義的border數(shù)值（0，none無(wú)效）
2.在父級(jí)內(nèi)部的添加上、下兩個(gè)空元素
3.在父級(jí)元素加： float:left; (clear:both;)
4.在父級(jí)元素加：overflow:hidden;
我個(gè)人覺(jué)得還是第四種比較好，1、2種方法有點(diǎn)不倫不類的，第三種浮動(dòng)吧，做不好還有“后遺癥”，所以加上overflow:hidden;比較保險(xiǎn)。