如何有效刪除 HTML 元素之間的空格？

忽略HTML 中的空白：「white-space-collapse」屬性

儘管HTML 和CSS 很流行，但令人驚訝的是，不是指示瀏覽器忽略空格的直接方法。當圖像等元素被不需要的空格錯誤地分隔時，這可能會導致令人沮喪的情況。

「white-space-collapse」屬性

雖然沒有普遍適用的屬性支援的解決方案，CSS 屬性「white-space-collapse」提供了一種有前途的方法。透過在圖像的父元素上將此屬性設為“丟棄”，您可以有效地消除它們之間的任何空白。

#parent_of_imgs { white-space-collapse: discard; }

缺點

不幸的是，這該解決方案受到一個重大缺陷的阻礙：（據目前所知）沒有主要瀏覽器實現了“ white-space-collapse”屬性。這意味著儘管它具有潛在的有效性，但廣泛使用仍然不切實際。

替代解決方案

作為替代方案，您可以在圖像之間添加 HTML 註解。雖然並不理想，但這種技術可以阻止瀏覽器渲染任何可見的空白。

<p>
  <!--
    --> <img src="." alt="" /> <!--
    --> <img src="." alt="" /> <!--
    --> <img src="." alt="" /> <!--
    --> <img src="." alt="" /> <!--
  -->
</p>

以上是如何有效刪除 HTML 元素之間的空格？的詳細內容。更多資訊請關注PHP中文網其他相關文章！