如何使用 CSS 消除圖片之間的空白？

使用CSS 消除影像之間的空白

在HTML 中連續顯示多個影像時，您可能會遇到分隔它們的不需要的空白。這種間隙是由於瀏覽器的預設內聯行為而產生的，瀏覽器在渲染內容時將空格、換行符和製表符視為單一空白。

要使用 CSS 有效消除此空白，請考慮設定 display 屬性您要封鎖的圖片。此修改強制圖像佔據整行，從而刪除任何前面或後面的空白：

<div class="nospace">
    <img  src="/static/imghwm/default1.png" data-src="image1.jpg" class="lazy"   style="max-width:90%" alt="如何使用 CSS 消除圖片之間的空白？" >
    <img  src="/static/imghwm/default1.png" data-src="image2.jpg" class="lazy"   style="max-width:90%" alt="如何使用 CSS 消除圖片之間的空白？" >
</div>

透過應用「display: block;」樣式規則到您的圖像，您確保它們表現為區塊級元素，填充整個可用寬度並堆疊在彼此之上。這種方法有效地消除了它們之間任何潛在的空白。

以上是如何使用 CSS 消除圖片之間的空白？的詳細內容。更多資訊請關注PHP中文網其他相關文章！