- ベストアンサー
<H>タグの見出しと<P>タグの本文の間隔について
初めてのホームページ作成に挑戦してます。 スタイルシートでデザインを調整しているのですが、 <H>タグの見出しと<P>タグの本文の間隔をCSSで二つの要素のマージンを0、パディング0にしても文字一つ分の間隔が空きます。ある一定の間隔以上縮めることができません。 また<H>タグと<TABLE>タグの間隔も<P>タグ以上に大きく間隔が開いてしまいそれ以上縮めることができなくて困ってます。 こういうものなんでしょうか? <DIV>タグなら間隔を好きなように調節でます。全て<DIV>タグで見出しも本文も書きたいくらいです。表は無理ですが・・・。
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
<h></h>と<p></p>の間に全角スペースがあったりはしませんか? <table>~</table>の中に<td></td>の中以外の場所に全角スペースがあったりはしませんか? ソースを見やすくするための形成(字下げ)に全角スペースを使っているとか。 (上記が当てはまるなら、字下げは半角スペースかタブキーで)
その他の回答 (3)
h1,p { line-height:1; } とかは試されましたか?
行間隔の空きはタグによって確かに違いますね。 とは言え、hタグ pタグにはSEO上の利点もあり、重要なタグなのでスルーするわけにも行きません。 私が使っているテクニックは、これと言う大事なところではpositionを使います。 例えば; <h1 style="position:relative; top:12;">abc</h1> こうすればこの場合h1の行が12ピクセル下がります。tableタグでも同じです。但し下げたものの上部は空きスペースが増えます。 同じような対策ですが、逆にその下に来る要素を上げる手もあります。 <h1>abc</h1> <div style="position:relative; top:-10;">def<br> ghi</div>
- Aronse
- ベストアンサー率30% (18/59)
閲覧しているブラウザにもよるかもしれません。 また、他の要素のマージンで間隔があいているのかもしれません。 ためしに、 <p>aaa</p> <p>aaa</p> <p>aaa</p> と並べてみても、どこも間隔があいているのか確かめてみたほうがよいかもしれません。 あと、cssファイルの該当箇所を書いていただけるといいと思います。
お礼
回答有難うございます。 解決出来ました。 HTMLソースのインデント設定でスペースを使っていたのが原因でした。 半角スペースは影響しないと思い込んでました。基本的なことが分かっていなかったです。