ブラウザに HTML の空白を無視させるにはどうすればよいですか?

HTML の空白を無視する

HTML では、要素間の空白により、レンダリングされた出力に不要なスペースが作成される可能性があります。これに対処するために、この質問では、ブラウザーに空白を無視させるための解決策を検討します。

答えは、CSS プロパティwhite-space-collapse: destroy; を使用することを提案しています。ただし、この機能はまだどのブラウザにも実装されていないことに注意してください。代替案として、回答では、HTML コメントを使用して空白を非表示にし、コード構造をより読みやすくすることを提案しています。

例:

#parent_of_imgs { white-space-collapse: discard; }
<!-- This feature is not yet implemented in any browser -->

<!-- Using comments as an alternative -->
<p>
  <!-- This is a comment -->
  <img src="/static/imghwm/default1.png" data-src="." class="lazy" alt="">
  <!-- This is a comment -->
  <img src="/static/imghwm/default1.png" data-src="." class="lazy" alt="">
  <!-- This is a comment -->
  <img src="/static/imghwm/default1.png" data-src="." class="lazy" alt="">
  <!-- This is a comment -->
  <img src="/static/imghwm/default1.png" data-src="." class="lazy" alt="">
  <!-- This is a comment -->
</p>

以上がブラウザに HTML の空白を無視させるにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。