• ベストアンサー

cssを使ってHPを作っているのですが。

HPを作り始めてまだ何日かという段階なのですが、ひとつ悩みがあり、御質問させていただきました。 知ったばかりのCSSを使ってつくっているのですが、<h2></h2>でカテゴリーへのリンクをつくり、その真下に<body>によるカテゴリーの簡単な説明を入れたいのですが、<p>や<br>など何も入れてないのに、スペースが出来てしまいます。また<h2></h2>で囲んだリンクを<table>で囲もうと思ったのですが、それもやはりリンクだけをうまく囲まずに、リンクの下に空白のスペースを作り、正方形のように囲まれてしまいます。 これはどうにかしたら解決できるのでしょうか? わかりにくくて申し訳ないですが、御回答お願いします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#20378
noname#20378
回答No.4

再び#1です。 間違えた。 ><p></p>でくくると当たり前ですが、スペースが出来てしまいます。 ブロックレベル要素pにもmarginやpaddingが設定されているからです >これは文法違反ですよね? ISO-HTML,HTML 4.01 Strict,XHTML 1.0 Strict,XHTML 1.1ではbody要素直下にはブロックレベル要素しか置けないから文法違反です。(TransitionalやFramesetでは許容されているが、これは過去との互換性のために残されているだけなので推奨しません) >また<dl></dl>を使ってないのに、いきなり<dd></dd>でくくるのもやはりおかしいですよね?このような場合はどうすればいいのでしょうか? くくってみたらいかがでしょう? <h1>見出し</h1> <dl> <dt>カテゴリ1</dt> <dd>カテゴリ1の説明</dd> <dtカテゴリ2</dt> <dd>カテゴリ2の説明</dd> </dl> と言う感じで。

shinshins
質問者

お礼

ありがとうございます。何度も御丁寧に。教えて頂いたサイトなどを参考に色々と試していたら、自分の思っている形にできました。 ソースも簡潔で観やすいサイトを作りたいとおもいます!

その他の回答 (3)

noname#20378
noname#20378
回答No.3

#1です。 書き方や継承・カスケーディングについては習得済みだと仮定します。 3.1 ボックスモデル http://www.tg.rim.or.jp/~hexane/ach/lbcs/lbcs3-01.htm も一応読んでおくといいでしょう。 さて、h2要素はブロックレベル要素であり、通常FirefoxやIE等のデフォルトスタイルシートではおそらくdisplay:block;が掛かり、marginやpaddingもそれなりの値に設定されているために行がスペースが開いて見えています。 もちろんこれらは製作者スタイルシートによって上書きすることが出来ますから margin:0; padding:0; を指定することで実現できることになります

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

CSS で h2 { margin:0; } としてみたらどうでしょうか? 蛇足ですが、<body> は、使いどころを確かめた方がよろしいかと思います。

shinshins
質問者

お礼

御回答ありがとうございました。 試してみたらこの問題については一応解決出来ました。 そうですね、今は極力<body></body>ではなく、CSS部に書くようにしています。

noname#20378
noname#20378
回答No.1

できたらソースを掲示してもらえないでしょうか? 場合によってはHTMLの文法をきちんと学びなおすことから始めた方がいいかもしれません 少し時間がかかってもいいなら 良質なテキストサイトの爲のISO-HTML入門 http://kaz.topaz.ne.jp/well/www/isohtml/ 口が悪くてもいいから簡潔に終わらせたいなら 1ページで騙(かた)るホームページ作成 http://www6.plala.or.jp/go_west/beginner/poison/instantpage.htm を勧めます。 html文書内にbody要素は一回しか現れることが出来ず、親や子になる要素にはそれぞれ制約がある、ということは重要なので解ってほしいです。すればおのずと原因も解ってくると思います

shinshins
質問者

補足

御回答ありがとうございます。こんなルールがあったとは全く知らなかったです。本にも書いてなかったので。 さらにひとつ質問なのですが、簡単に書くと、 ~省略~ <body> <h1>見出し</h1> <h2>それぞれのカテゴリー名</h2> とあって、その真下にこの簡単な説明を説明を入れたいのですあ、<p></p>でくくると当たり前ですが、スペースが出来てしまいます。何も付けずに書き始めると上手く表示されるのですが、これは文法違反ですよね?また<dl></dl>を使ってないのに、いきなり<dd></dd>でくくるのもやはりおかしいですよね?このような場合はどうすればいいのでしょうか?

関連するQ&A