間を開けたいから<p>&nbsp;</p>や<br><br><br><br>はいけません

<p>は段落を定義するタグ。
<br>は改行するタグ。
&nbsp;は区切りなしスペース。

隙間を開けたい時に<br><br><br>とは書かないでください。

実は職業訓練の制作の時、「ここはちょっとスペースを特別に開けたいな」ということがありまして<br><br><br>なんて書きました。そして「ソースが汚い!意味の通らないソースになってる!」と教えてもらい、「意味」を意識するんだ、とやっと教えてもらっていた<p>タグ、<br>タグの意味とつながりました。
そこからなるべく<br><br><br>とスペースを確保することはしないように気を付けたという経緯がありました。

でも、行の下開けたい場合もあるのはわかります。
そのためにCSSを学びました。

段落がここから始まるよ~!とお知らせする役目の<p>タグ。
囲まれた部分がひとつの段落ですよという意味の<p>タグ。
ですから、<p>&nbsp;</p>と書いてしまうと本末転倒。

面倒でも美しいソースを心がけてスタイルシートで見た目は整えることがマスト!

<div id="content">
  <p>一行目の文章があります</p>
  <p>二行目の文章があります</p>
</div>

さて、<p>と、<p>の間を開けたいときはもう<br>とは書きませんね?
CSSに下記のように指定しましょう。

#content p {
	margin-bottom: 10px;
}

普通のpタグに上のCSS設定していたとして、じゃあnext-contentsとかclassでもつけて、20px空けたい場合下記のようにしましょうよ、ということでした。

#content p {
	margin-bottom: 10px;
}
#content .next-contents{
	margin-bottom: 20px;
}

“間を開けたいから<p>&nbsp;</p>や<br><br><br><br>はいけません” への1件の返信

この記事にコメントを残す