首頁 > web前端 > css教學 > 如何消除 HTML 元素之間不必要的空白?

如何消除 HTML 元素之間不必要的空白?

Barbara Streisand
發布: 2024-12-21 15:20:11
原創
349 人瀏覽過

How Can I Eliminate Unwanted Whitespace Between HTML Elements?

克服 HTML 中的空白

在 HTML 和 CSS 領域,當意外的空白破壞圖像的預期佈局或文字。不過,不用擔心,因為這個問題可以透過簡單的 CSS 技巧來解決。

CSS 解

要消除元素之間的空白,您可以使用「white」 -space-collapse' 屬性:

#parent_of_imgs { white-space-collapse: discard; }
登入後複製

此命令指示瀏覽器忽略HTML 元素之間的任何空格字元。不過,要注意的是,目前還沒有瀏覽器支援此功能。

替代方法

如果您希望避免使用CSS,您可以使用不太優雅的方法添加HTML 註釋以創建無間距錯覺的方法:

<p>
  <!--
    --><img src="." alt="" /><!--
    --><img src="." alt="" /><!--
    --><img src="." alt="" /><!--
    --><img src="." alt="" /><!--
  -->
</p>
登入後複製

雖然不是理想的解決方案,但此方法有效地消除了影像之間的空白。

以上是如何消除 HTML 元素之間不必要的空白?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板