ホームページ制作で複数行の空白行を入れるには

（ホームページ制作の勉強中です。）

文章のと文章の間に複数行の空白行を入れには、<br>タグを
数回入力すれば可能ですが、他にに何か良い方法があるのでしょうか？
（<br>タグは、むやみに使わないほうがよいと聞きますので・・・）

No.1 回答者： mizutaki 回答日時： 2009/06/06 15:53

スタイルシートでmarginの値をいじってあげれば空白などを作れますが、

brで十分だと思いますよ。
後はpやdivを使ったりする場合もあるでしょうが、
文書の中に空白を入れたりするのであれば、むしろbrかpで十分。
それ以外の方法で空白を入れたりすると、後々の編集で少し手間が発生する可能性もありです。

この回答へのお礼

なるほど！　後々の編集で、手間が発生する可能性が出てくるかもしれませんね。
ありがとうございました。

お礼日時：2009/06/13 16:01

No.2 ベストアンサー 回答者： think49 回答日時： 2009/06/06 16:36

> (<br>タグは、むやみに使わないほうがよいと聞きますので・・・)

確かに論理構造を考えるとbrじゃなくてpを使った方がいいということはあります。

考え方としては、「コンテンツの論理構造を考えてから見た目を整える」という順序に気をつけるということでしょうか。
(意外と逆に考えがちなんですよね…。)

** 段落で区切る

<p>....文章...</p>
<p>....文章...</p>
<p>....文章...</p>

** CSSで見た目を整える

p{
margin: 1em 0px;
}


** 章の節目を空行2つ分にしてみる

.chapter{
margin-top: 2em;
}
p{
margin:
}

<p class='chapter'>....文章...</p>
<p>....文章...</p>
<p>....文章...</p>
<p class='chapter'>....文章...</p>
<p>....文章...</p>


章立てはdivで区切ってもいいですし、その辺はお好みです。

第一章の部分で margin-top: 2em を適用させたくなかったら、:first-child を使ってみてください。
IE6が対応していませんが、「大した問題じゃないと割り切る」か「.first-child のclassで代替する」か「http://trac.openpne.jp/ticket/2553 を使ってみる」か…。
クロスブラウザに関しては手間と効率と目的のバランスを考えて、決めるといいと思います。

この回答へのお礼

大変勉強になりました。
ありがとうございました。

お礼日時：2009/06/13 15:59

No.3 回答者： Safe_Mode 回答日時： 2009/06/06 16:46

空白行を入れる理由は何なのでしょう？

単純にレイアウト的な都合だったら前後の<p>タグのmargin設定などで
行なうのがいいでしょう。

この回答へのお礼

はい、レイアウトが目的です。

marginを使って見ました。上手くいきました。
ありがとうございます。

お礼日時：2009/06/13 15:58

No.4 回答者： xs200 回答日時： 2009/06/06 17:13

<p>は改行ではありません。

<br>の連発もお勧めできません。
やはりスタイルシートでやるべきでしょう。
例:marginは出たのでline-heightで

行間広すぎ<div style="line-height:800%">っていう</div>感じかな。

この回答へのお礼

このような方法もあるのですね。
勉強になりました。
ありがとうございます。

お礼日時：2009/06/13 15:54