行間・上下間のスペースを自由自在に空けたい場合のHTMLタグ

※当サイトは、Google Adsense、Amazonアソシエイト、各種アフィリエイト広告を利用しています。また、製品PRを行っている場合があります。

サイト制作の際
一部行間だとか、上下コンテンツの間のスペースを空けたいとか
色々思うことがあるかと思う。

その際にどのタグを使うのがベストなのか
気になることもあるかと思う。

その答えは臨機応変に
状況に合わせるべしというのが結論だ。

そのためにも色んなパターンを知っておくと便利かもしれない。

簡単な方法だと

<br><br><br>

 

といった感じで大量に改行タグを入れるのもありだが
ソース的に見苦しい上、環境によっては認知されない場合がある。

そのため、
賢い方法としてCSSで
指定しておくのがベストかもしれない。

例えば

<div style="height:30px;"></div>

 

こんな感じで
高さを指定してやれば
自由自在に空白を作ることも出来る。

これを外部ファイルで色んなパターンで用意しておけば
classの指定だけで変えられるので楽かもしれない。

あとCSSを使わない方法として
今はやらないが過去にやっていたのは

<table border="0" height="50px">
<tr><td></td></tr></table>

こんな感じで見えないテーブルタグをかましていたこともある。

さらに荒業としてPNG形式の透明画像を差し込んで
高さを変えて調整しているのも以前見かけたこともある。

どの方法もデザインを崩さないのであれば
正解だが、プロとして活躍していくならば
CSSを究めるべし。

<スポンサーリンク>



\応援ありがとうございます🌿/
各種ブログランキングに参加しています✨

ブログランキング・にほんブログ村へ人気ブログランキングおかげさま『感謝の種まき』 - にほんブログ村人気ブログランキングでフォロー
アバター画像

Hiro先生

おかげさまで豊かさに満たされた日々を
今、素敵に生きています
感謝の種まきによって人生が根底から変わることを知って
素敵なご縁の輪を広げながら、
望む未来を叶える、奇跡を起こし続けるお手伝いをしています。

記事本文: 351