ホームページを作成中です。背景について、どうしても分からないので質問さ

質問

ホームページを作成中です。背景について、どうしても分からないので質問させていただきます。
http://canon.jp/
上記のような感じにしたいのですが、全体のページはセンターに、背景は両サイドがグレーになっています。ページの一番下には、どのページも見ても同じ内容（お問い合わせへのリンクなど）が表記されるようになっています。これはきっとテンプレートを最初に作成して、それを全体のページに使用してるのかな…と思って見ているのですが、どうしてもやり方が分かりません。
これは、タグで設定する、などという単純なものではないのでしょうか？
同じパターンを繰り返して使ったり、写真のデータを固定したりする方法は知っているのですが、上記のようにする方法が分かりません。
どうか、知っておられる方、お力をお貸しくださいませ。

回答No.2

qualheart · ベストアンサー

タグを並べるだけではダメですね。
普通にタグが持っている規定の情報だけでは、細かいスタイルの設定はできません。
多分知ってはいると思いますが、細かい位置やスタイルはCSSにて記述します。

背景は単純に全体を囲む<DIV>タグを作り、それをセンターに表示するようにCSSを記述してるだけですね。
ページ下のフッターも同様です。<DIV>タグでフッターとなるブロックを囲み、表示の仕方をCSSで設定しているだけです。
基本的にホームページの大まかなブロック要素は<DIV>で囲ってその表示位置をCSSにて記述します。
<div id="main">
<div id="header">～</div>
<div id="contents">～</div>
<div id="footer">～</div>
</div>
のような感じで。

こまかな表示位置の設定の仕方は参照URLのようなCSSによるレイアウトの仕方を勉強すれば分かると思います。

ご参考まで。

参考URL：

http://css.uka-p.com/

お礼

ご丁寧にありがとうございます！
cssを勉強すればよいのですね。
何を勉強すればよいのかも分からない状態でしたので、教えて頂き大変助かりました！
cssの本を買って勉強したいと思います。
本当にありがとうございました！

回答No.1

otaku37564

これはCSS+HTMLの単純な構造です。

まず一番下の背景は灰色
次に横950pxほどの両はしに3px分シャドウの付いた白い高さ20PXくらいの画像を用意
CSSでこれを背景に設定し、Y軸に連続描写の設定を入れます。（親と表記します）

そのボックスの中にメニューや文字を入れます。
（子と表記します）

組合としては

背景灰色
親.cssのボックスここからスタート（マージンの左右をオートに設定）

子メニューとか文字（マージンの左右をオートに設定）

親.CSSボックスここで閉じる

という構造です。
これで、どんなモニターでもページは真ん中に表示されます。

子が親よりも幅を小さく制作して組み合わせていくので
テンプレートなんぞ使わなくてもすぐ出来ます。

お礼

ご丁寧に回答下さり、ありがとうございます！
cssというものの、存在は知っておりましたが、
今まで手を付けたことがありませんでした。
今回、教えて頂いたことを無駄にしないように、
本を買って勉強したいと思います！
本当にありがとうございました！