- 締切済み
段落の高さを調節することは出来ますか？
はじめまして、SyuNeといいます。 段落と段落との間をスタイルシートか何かで広げたいのですが、そういうことって可能なのでしょうか？ やっぱり行間しか高さ調節は出来ないのでしょうか。 もし段落の高さを変える方法を知っていればどなたかぜひ教えください。
- みんなの回答 （5）
- 専門家の回答
みんなの回答
- d-3
- ベストアンサー率42% (16/38)
>どうやら私は思い違いをしていたようで、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となります。
- steelgreen
- ベストアンサー率50% (50/100)
p以外でならばdivを使います。 divは汎用ブロック要素と呼ばれる物で、一般的には この要素の前後は改行されます。 スタイルシートではこの改行のスペースを制御できます。 制御方法はpaddingよりもmarginを使います。 #理由はpaddingはdivによって作られた領域内のスペースを 制御するものに対し、marginは領域外に対してスペースを指定 するものだからです。 スタイルシート <style type="text/css"><!-- div.paragraph{ margin-bottom:30(任意の数字）px; } --></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です。 スタイルシートを扱う上でこの違いを理解しておいて損はないですヨ。
- nitto3
- ベストアンサー率21% (2656/12205)
私はスタイルシートの margin を使っています。
こんにちは！ <head> <style type="text/css"> <!-- p { padding-top: 0px; padding-right: 0px; padding-bottom: 30px; padding-left: 30px; } --> </style> </head> 数字のところを色々試してみて下さい。 ただ対応ブラウザがどこからだったか忘れてしまいました。m(_ _)m
補足
こんにちは。 早速のご回答ありがとうございます。 どうやら私は思い違いをしていたようで、Pタグの「段落」、ではなく<BR>タグの後に改行することなく改行と改行との間を開けたかったようです(^^;ゞ お手間でなければスタイシートを使ってBRタグとBRタグとの間を空ける方法を（あれば）教えてくださいm(__)m
padding-bottomを使ってできるかもしれませんね。 正確に言うとこれは段落と段落の幅を指定するのではなく、文章の最後と段落の外枠（通常は見えない）の幅を指定するCSSなんですが、見かけは段落と段落の間が広がったように見えると思います。 ○段落個別に設定するなら・・・ 適用したい段落タグ（pもしくはdiv）にSTYLE指定をします。 指定した段落だけに適用されます。 <p style="padding-bottom: 50px">こんにちは</p> ○特定のタグ全体に設定するなら・・・ <head>内に以下の通り記述。（段落pタグ、幅50ピクセルの場合。divタグならpの部分をdivにしてください。50の部分に希望の数値を入れる。） そのページ内のすべてのpタグに適用されます。 <style TYPE="text/css"> <!-- p {padding-bottom:50px; } --> </style>
補足
早速のご回答ありがとうございます。 どうやら私は思い違いをしていたようで、Pタグの「段落」、ではなく<BR>タグの後に改行することなく改行と改行との間を開けたかったようです(^^;ゞ お手間でなければスタイシートを使ってBRタグとBRタグとの間を空ける方法を（あれば）教えてくださいm(__)m
お礼
ご回答ありがとうございます。 ですがすみません、不勉強でmarginタグの使い方が今ひとつ分かりませんでした(^^;ゞ