??li{
????list-style:?none;
????float:?left;
??}
??li{
????list-style:?none;
????display:?inline-block;
??}
??
??????<li><img?src="1.jpg"?height="350"?width="500"></li>
??????<li><img?src="2.jpg"?height="350"?width="500"></li>
??????<li><img?src="3.jpg"?height="350"?width="500"></li>用 display: inline-block; 會在圖片中間存在空隙 , float: left; 就沒有 .為什么會這樣 ?
4 回答

qq_大寒_2
TA貢獻173條經(jīng)驗 獲得超185個贊
應(yīng)該是li之間的回車換行符造成的。你可以這樣測試下。
<li><img?src="1.jpg"?height="350"?width="500"></li><li><img?src="2.jpg"?height="350"?width="500"></li>

心之東夢之東
TA貢獻1條經(jīng)驗 獲得超3個贊
display:inline-block ?這個默認的會有間隙,在inline-block使用處設(shè)置font-size:0應(yīng)該能解決這個問題

晴書文文
TA貢獻64條經(jīng)驗 獲得超75個贊
<li>標(biāo)簽,是塊級元素。但你使用display:line-block;時。<li>標(biāo)簽變成了內(nèi)聯(lián)元素。然后圖片就水平排列了,這時候圖片之間會存在空隙,然后你又用浮動:float:left: 使他們脫離文檔流了,所以就不會有空隙了。
請采納!
添加回答
舉報
0/150
提交
取消