文章詳情頁(yè)
li中插入img圖片間有空隙的解決方案
瀏覽:122日期:2022-06-02 14:03:34
直接加樣式img{vertical-align:bottom; display:block}
當(dāng)然在某些情況下無(wú)效,比如我要加三個(gè)圖片,上中下,中間的圖片是設(shè)為背景,發(fā)現(xiàn)用此方法無(wú)效,只是上和中的圖片空隙沒(méi)了,而下與中之間還存在,方法很簡(jiǎn)單,把vertical-align:bottom改成top,可根據(jù)自己遇到的不同情況來(lái)設(shè)vertical-align的參數(shù)
方法一:
復(fù)制代碼 代碼如下:
img{vertical-align:top; display:block}
復(fù)制代碼 代碼如下:
<style>
#l1 {float:left;background:#000;}
#l1 ul li {list-style:none;padding:0;margin:0}
img {vertical-align:bottom; display:block;}
</style>
方法二:設(shè)置容器font-size:0(個(gè)人認(rèn)為這種方法最好!!!)
相關(guān)文章:
1. IntelliJ IDEA卡死,如何優(yōu)化內(nèi)存2. IntelliJ IDEA刪除類(lèi)的方法步驟3. Java 根據(jù)網(wǎng)絡(luò)URL獲取該網(wǎng)頁(yè)上面所有的img標(biāo)簽并下載圖片4. 使用HttpClient增刪改查ASP.NET Web API服務(wù)5. IntelliJ IDEA設(shè)置條件斷點(diǎn)的方法步驟6. python使用Streamlit庫(kù)制作Web可視化頁(yè)面7. IntelliJ IDEA安裝插件的方法步驟8. intellij idea使用git stash暫存一次提交的操作9. 網(wǎng)頁(yè)中img圖片使用css實(shí)現(xiàn)等比例自動(dòng)縮放不變形(代碼已測(cè)試)10. Eclipse 3.2 M5 提供下載-兼容JSE 6.0
排行榜
