IE6、IE7下,li會出現(xiàn)縫隙的淺析 |
發(fā)布時(shí)間: 2012/7/20 17:00:45 |
IE6、IE7下,li會出現(xiàn)縫隙的淺析,那么出現(xiàn)縫隙怎么辦呢?今天,在群里無意間看到一個(gè)朋友,提到了一個(gè)問題! 電腦技巧www.boydavid.com 話說,在IE6、IE7下豎排會導(dǎo)致一個(gè)bug,就是每個(gè)li之間都有個(gè)縫隙?個(gè)人對這句話,表示很大的質(zhì)疑,首先, 電腦知識www.boydavid.com 不說別的,默認(rèn)什么情況,什么樣式都不加,li豎排吧,IE6、7下會有問題么??答案:不會! 電腦軟件www.boydavid.com 所以首先,我們先要搞清楚,這個(gè)問題是怎樣引發(fā)的?什么情況下引發(fā)的? 電腦入門www.boydavid.com 答:li里面的內(nèi)容有浮動,但是li本身并沒有浮動,就會造成上述的問題! 電腦維護(hù)www.boydavid.com 解決:給li加個(gè)verticle-align屬性即可,具體的值,是top、middle、bottom無所謂!這樣問題就迎人而解了,
但是具體為什么呢?為什么會在IE6、7下產(chǎn)生為題呢?我們只能把責(zé)任推給他們的開發(fā)商了,可能是當(dāng)時(shí),開發(fā)
IE6、7瀏覽器的時(shí)候,遺留下來的問題吧! 計(jì)算機(jī)學(xué)習(xí)網(wǎng)站www.boydavid.com 上個(gè)例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> 電腦常識www.boydavid.com <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 計(jì)算機(jī)愛好者www.boydavid.com <title>無標(biāo)題文檔</title>
<style>
li{ line-height:30px; background:red; width:300px; verticle-align:middle;}//此處verticle-align是解決問題的關(guān)鍵! 電腦技術(shù)www.boydavid.com li a{ float:left;}
</style>
</head>
<body> 電腦軟件www.boydavid.com <ul> 電腦硬件www.boydavid.com <ul> 電腦硬件www.boydavid.com <li><a href="javascript:;">asdfasdfasdfasdf</a></li>
<li><a href="javascript:;">avcvxcvxcvxc</a></li>
<li><a href="javascript:;">456645t45545</a></li>
</ul> 本文出自:億恩科技【mszdt.com】 服務(wù)器租用/服務(wù)器托管中國五強(qiáng)!虛擬主機(jī)域名注冊頂級提供商!15年品質(zhì)保障!--億恩科技[ENKJ.COM] |