HTML 要素間の不要な空白を削除するにはどうすればよいですか?

HTML の空白を克服する

HTML と CSS の領域では、意図しない空白によって画像や画像の意図されたレイアウトが妨げられるとイライラすることがあります。文章。ただし、この問題は簡単な CSS トリックで対処できるため、心配しないでください。

CSS ソリューション

要素間の空白を削除するには、「white」を利用できます。 -space-collapse' プロパティ:

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

このコマンドは、HTML 間のスペース文字を無視するようにブラウザに指示します。要素。ただし、現在この機能をサポートしているブラウザがないことに注意してください。

代替アプローチ

CSS の使用を避けたい場合は、あまり洗練されていない方法を使用できます。 HTML コメントを追加してスペースがないように見せる方法:

<p>
  <!--
    --><img src="/static/imghwm/default1.png" data-src="." class="lazy" alt=""><!--
    --><img src="/static/imghwm/default1.png" data-src="." class="lazy" alt=""><!--
    --><img src="/static/imghwm/default1.png" data-src="." class="lazy" alt=""><!--
    --><img src="/static/imghwm/default1.png" data-src="." class="lazy" alt=""><!--
  -->
</p>

この方法は理想的な解決策ではありませんが、効果的には効果的です。画像間の空白を削除します。

以上がHTML 要素間の不要な空白を削除するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。