段落の高さを調節することは出来ますか？

締切済

質問者：SyuNe
質問日時：2003/03/04 03:24
回答数：5件

はじめまして、SyuNeといいます。

段落と段落との間をスタイルシートか何かで広げたいのですが、そういうことって可能なのでしょうか？
やっぱり行間しか高さ調節は出来ないのでしょうか。

もし段落の高さを変える方法を知っていればどなたかぜひ教えください。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (5件)

最新から表示
回答順に表示

No.5

回答者： d-3
回答日時：2003/03/05 12:19

>どうやら私は思い違いをしていたようで、Pタグの「段落」、ではなく<BR>タグの後に改行することなく改行と改行との間を開けたかったようです(^^;ゞ

スタイルシートに

span.spacer {
line-height: *;
}
（*に空けたい間隔を指定）

HTMLに

<p>この文章はサンプルです。<br>
<span class="spacer">　</span><br>
行間は調整できたでしょうか？<p>

と記述することでできました。
　つまり、ダミーの<span>を用意してそれの高さで調節してるわけです。が、これではCSSを使う意味があまりないような気がします。<br>を使って改行するなら、別な段落として記述したほうがいいと思います。

上の例なら、

スタイルシートに

p {
margin: 1em 0em;
}
（余白一括指定：上下1em,左右0em）

HTMLに

<p>この文章はサンプルです。</p>
<p>行間は調整できたでしょうか？</p>

とします。

margin同士が連続する場合、大きいほうの余白となるので、上のように上下に余白を指定しても段落間の余白は合計の2emにはならず、1emとなります。

- 1
- 件

通報する

No.4

回答者： steelgreen
回答日時：2003/03/05 01:02

p以外でならばdivを使います。

divは汎用ブロック要素と呼ばれる物で、一般的には
この要素の前後は改行されます。

スタイルシートではこの改行のスペースを制御できます。
制御方法はpaddingよりもmarginを使います。

#理由はpaddingはdivによって作られた領域内のスペースを
制御するものに対し、marginは領域外に対してスペースを指定
するものだからです。

スタイルシート
<style type="text/css"></style>

HTML
<div class="paragraph">
あいうえお　かきくけこ
</div>
<div class="paragraph">
さしすせそ　たちつてと
</div>

>スタイシートを使ってBRタグとBRタグとの間を
空ける方法を（あれば）教えてくださいm(__)m

BRタグとBRタグとの間というのはちょっとわからないのですが、
BRを使わないで間を空ける方法と解釈しました。

paddingとmarginの違いは
<div style="width:100px;height:100px;border:solid 1px #000;">
paddingとmarginの違い
</div>

とした時、線の内側において文字と線との間を制御するのがpadding。
線の外側とのスペースを制御するのがmarginです。
スタイルシートを扱う上でこの違いを理解しておいて損はないですヨ。

- 0
- 件

通報する

No.3

回答者： nitto3
回答日時：2003/03/04 08:25

私はスタイルシートの margin を使っています。

- 0
- 件

通報する

この回答へのお礼

ご回答ありがとうございます。
ですがすみません、不勉強でmarginタグの使い方が今ひとつ分かりませんでした(^^;ゞ

通報する

お礼日時：2003/03/04 09:49

No.2

回答者： yayopix
回答日時：2003/03/04 05:27

こんにちは！

<head>
<style type="text/css">

</style>
</head>

数字のところを色々試してみて下さい。

ただ対応ブラウザがどこからだったか忘れてしまいました。m(_ _)m

この回答への補足

こんにちは。
早速のご回答ありがとうございます。

どうやら私は思い違いをしていたようで、Pタグの「段落」、ではなく<BR>タグの後に改行することなく改行と改行との間を開けたかったようです(^^;ゞ

お手間でなければスタイシートを使ってBRタグとBRタグとの間を空ける方法を（あれば）教えてくださいm(__)m

補足日時：2003/03/04 09:47

通報する

- 0
- 件

通報する

No.1

回答者： noname#48234
回答日時：2003/03/04 04:13

padding-bottomを使ってできるかもしれませんね。

正確に言うとこれは段落と段落の幅を指定するのではなく、文章の最後と段落の外枠（通常は見えない）の幅を指定するCSSなんですが、見かけは段落と段落の間が広がったように見えると思います。

○段落個別に設定するなら・・・
適用したい段落タグ（pもしくはdiv）にSTYLE指定をします。
指定した段落だけに適用されます。

<p style="padding-bottom: 50px">こんにちは</p>

○特定のタグ全体に設定するなら・・・
<head>内に以下の通り記述。（段落pタグ、幅50ピクセルの場合。divタグならpの部分をdivにしてください。50の部分に希望の数値を入れる。）
そのページ内のすべてのpタグに適用されます。

<style TYPE="text/css">

</style>