在HTML中處理圖片時，有時候會發(fā)現(xiàn)圖片跟下方邊框之間存在一個空行，盡管屬性設(shè)置中并沒有這樣的設(shè)定。那么面對這種情況，我們應(yīng)該怎么辦呢？ 步驟一：插入多張圖片 首先，在HTML中插入多張圖片，并對

在HTML中處理圖片時，有時候會發(fā)現(xiàn)圖片跟下方邊框之間存在一個空行，盡管屬性設(shè)置中并沒有這樣的設(shè)定。那么面對這種情況，我們應(yīng)該怎么辦呢？

步驟一：插入多張圖片

首先，在HTML中插入多張圖片，并對其添加修飾。

步驟二：浮動圖形

目前，我們的效果是三個小圖被包含在一個大框內(nèi)，大框的邊框為紅色。

步驟三：清除浮動

為了使這三個圖形橫排顯示，我們需要將它們進行浮動。然而，由于浮動的緣故，原本紅色邊框無法擴展整個容器。因此，我們需要在父級元素中添加overflow:hidden;屬性或在浮動元素后面添加clearfix清除浮動的命令。

步驟四：去除空行間隔

此時，你可能會注意到圖形與下方紅色邊框之間存在一個空行間隔。

步驟五：設(shè)置圖像為塊級元素

為了解決空行間隔的問題，我們可以將lt;imggt;元素設(shè)置為塊級標(biāo)簽。

步驟六：消除間隔

通過以上設(shè)置，圖形與下方邊框之間的間隔將會消失，達到預(yù)期效果。