- ベストアンサー
こんにちは、HP作成をある初心者向けの本で練習していますが、
こんにちは、HP作成をある初心者向けの本で練習していますが、 まずdivというのが範囲指定というのはわかるのですがそもそもdivというのは どういう意味なのでしょうか?あとdiv idとdiv classの使い分けがいまいちわかりません。 それとわかりにくいかもしれませんがある画像の上に、重ねるように(大きさは下のほうが若干大きいです) もう一つの画像を張るにはどうすればいいでしょうか?よろしくおねがいします。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
NO.1の回答者です(補足拝見済み) 折角だから、div を多用してみましょうか。 <div style="background:url( ); padding: 20px;"> <div style="background:url( ); padding: 20px;"> <div style="background:url( ); padding: 20px;"> <a><img src=" " /></a> </div> <div style="background:url( ); padding: 20px;"> <a><img src=" " /></a> </div> </div> </div> これを試したら理解出来るでしょう。 遊び感覚で良いから、何でも試してみる事。 ------------------------------------ 2枚目とか3枚目とか上下とか言われても意味が分かりませんよ・・・ 具体的な説明より、試したソースを書いてくれた方が回答しやすい。
その他の回答 (1)
- naokita
- ベストアンサー率57% (1008/1745)
divに意味はありません。 意味の無いブロック要素なので、"囲い"と思えば良いでしょう。 HTMLだけならあまり使いませんが、 CSSを適応させる範囲や項で div を良く使います。 id と class の使い分けは、ここでは説明しきれませんが、 簡単に言えば、 id="wrap" id="head" id="menu" id="footer" など、そのページの1つだけ決まっている項目(複数不可って事) 柔軟に使えるのは、class なので 最初は class を使えるようになりましょう。 複数ページにCSSを適応する場合に利用方法が理解出来ると思います。 ----------------------- 画像を重ねるのは、CSSで可能ですが、 少し大きい程度の画像は画像ソフトで重ねて1枚にするのが現実的です。 下とは背景画像の意味だと思いますが、 多用するなら、div に background:url( ); を使い その中に img を置くだけ。 <div style="background:url( ); padding: 20px;"> <img src=" " /> </div> こんな感じです。その他の方法も多々ありますが・・・
補足
お返事ありがとうございました。大変参考になりました。 それで最後の画像についてなのですが追加で質問させてください。質問をもう少し詳しく書きますと、 一番下に背景画像(メイン画像として扱っています)があり、その上にある画像を入れます。そのまた上に画像を入れるという感じです。 1番下は、CSSの<body>にbackgroundimageで入れると思います。2枚目からよくわからなくて おそらく普通に<body>欄に画像の名前を入れると思います。これをどう配置するかは、 CSSでleftとかrightとかpaddingとかで入れると思います。しかしまず ここまであっているかわかりません。次に3枚目ですが、これも2枚目と同じようにやると いうやり方もありなのでしょうか?わかりにくいと思いますがよろしくお願いします。 (ちなみに3枚目はリンクを貼る必要性がある画像ですが、画像ソフトで画像とテキストを 張り合わせたものです。)(又回答にあるやり方ですが、2枚目・3枚目をどのように記述すればいいでしょうか?あわせてお願いします)