ホームページを作成中です。背景について、どうしても分からないので質問させていただきます。
http://canon.jp/
上記のような感じにしたいのですが、全体のページはセンターに、背景は両サイドがグレーになっています。ページの一番下には、どのページも見ても同じ内容(お問い合わせへのリンクなど)が表記されるようになっています。これはきっとテンプレートを最初に作成して、それを全体のページに使用してるのかな…と思って見ているのですが、どうしてもやり方が分かりません。
これは、タグで設定する、などという単純なものではないのでしょうか?
同じパターンを繰り返して使ったり、写真のデータを固定したりする方法は知っているのですが、上記のようにする方法が分かりません。
どうか、知っておられる方、お力をお貸しくださいませ。
No.2ベストアンサー
- 回答日時:
タグを並べるだけではダメですね。
普通にタグが持っている規定の情報だけでは、細かいスタイルの設定はできません。
多分知ってはいると思いますが、細かい位置やスタイルは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
- 回答日時:
これはCSS+HTMLの単純な構造です。
まず一番下の背景は灰色
次に横950pxほどの両はしに3px分シャドウの付いた白い高さ20PXくらいの画像を用意
CSSでこれを背景に設定し、Y軸に連続描写の設定を入れます。(親と表記します)
そのボックスの中にメニューや文字を入れます。
(子と表記します)
組合としては
背景灰色
親.cssのボックスここからスタート(マージンの左右をオートに設定)
子メニューとか文字(マージンの左右をオートに設定)
親.CSSボックスここで閉じる
という構造です。
これで、どんなモニターでもページは真ん中に表示されます。
子が親よりも幅を小さく制作して組み合わせていくので
テンプレートなんぞ使わなくてもすぐ出来ます。
ご丁寧に回答下さり、ありがとうございます!
cssというものの、存在は知っておりましたが、
今まで手を付けたことがありませんでした。
今回、教えて頂いたことを無駄にしないように、
本を買って勉強したいと思います!
本当にありがとうございました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Illustrator(イラストレーター) アイビスペイント、原稿作成について 1 2023/07/14 03:01
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- PowerPoint(パワーポイント) PowerPointの背景について 1 2023/03/12 15:22
- 画像編集・動画編集・音楽編集 動画をディスク作成すると画像が乱れる。 4 2022/06/24 07:49
- SEO ホームページを作る際の質問です 1 2023/06/07 18:50
- WordPress(ワードプレス) wordpressでphpを読み込みたい 1 2022/10/30 23:40
- その他(IT・Webサービス) 知見のある方、教えてください。AI技術を活用して絵本を作りたいです 1 2023/04/13 13:28
- 雑誌・週刊誌 のり付けされている雑誌の解体方法 3 2023/03/15 21:38
- au(KDDI) 特定の画面を見るとスマホが固まります ご覧頂き有難うございます。 特定のページを見るとスマホが固まり 1 2023/08/21 19:29
- WordPress(ワードプレス) ワードプレスのパーマリンク設定について 1 2023/02/11 19:08
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ASP.NETでの縦・横スク...
-
NN4.78が途中までしか読...
-
掲示板を作成しておりアップロ...
-
1から100までの自然数のうち、2...
-
css 横並びのナビゲーションバ...
-
画像にリンクを張ると画像がず...
-
ポップアップメニューを表のよ...
-
カラープレーンってなんですか?
-
超音波で洗脳。
-
line-height指定で発生する余白...
-
htmlの文字が縦書きになる
-
ポップアップメニューの作成方...
-
CSSのセレクタに指定するbodyと...
-
smallにtext-allignが効かない
-
HTMLタグのDL DT DDを使ってli...
-
CSS/日本語のID・クラス名につ...
-
一括で全体を右にずらす
-
「諸要素」とはどういう意味で...
-
【ヒトの神秘】美男美女から何...
-
article、section、hgroup?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
掲示板を作成しておりアップロ...
-
wordpressでキャプション内で改...
-
ASP.NETでの縦・横スク...
-
NN4.78が途中までしか読...
-
どこをテーブルで作るべきか、d...
-
htmlの文字が縦書きになる
-
【ヒトの神秘】美男美女から何...
-
htmlのolやulなどlistにtitleや...
-
<h1>、<h2>と<p><div>の行間を...
-
HTML属性での「""」 「''」違い
-
超音波で洗脳。
-
widthやheightの数値に単位(px...
-
ボタンをセル内一杯に表示させ...
-
div要素が重なってします
-
リストマーカーをボックス内に...
-
質問1.
-
<div id="container">の使いか...
-
リンクを知らせる手のマークが...
-
画像イメージの上下左右、欲し...
-
複数のボタンを等間隔に、かつ...
おすすめ情報