【HPの作り方】Yahoo!のように両端を空けたレイアウトのHPを作る方法が分かりやすく解説してあるHPがあったら教えてください。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2005/12/24 13:03:27
  • 終了:--

回答(6件)

id:fuk00346jp No.1

潮澤 昴回答回数1140ベストアンサー獲得回数542005/12/24 13:25:56

ポイント15pt

<CENTER>

<TABLE>

<TBODY>

<TR>

<TD></TD>

</TR>

</TBODY>

</TABLE>

</CENTER>


テーブル組みして CENTERタグ で囲ってるだけです。

id:onigiritabetai

ありがとうございます。ホームページビルダーなどで作る場合の方法を教えているHPも教えていただけますと大変ありがたいです。

2005/12/25 16:40:14
id:arcana No.2

arcana回答回数120ベストアンサー獲得回数102005/12/24 13:26:40

ポイント15pt

> 文章を中央に表示しながら読みやすくするにはtableを利用します。


部分を利用すると良いと思います。

追加でテーブル幅を指定すると一層見栄えが良くなりますね。

あとはその他のオプションで色を付けたりなど。

その解説はこちら:http://html.eweb-design.com/0701_tbl.html

id:onigiritabetai

ありがとうございます。参考になります。

2005/12/25 16:40:49
id:cochlea No.3

cochlea回答回数112ベストアンサー獲得回数32005/12/24 15:08:01

ポイント15pt

http://picks.dir.yahoo.co.jp/

Yahoo! JAPAN - ��������

全てのコンテンツをtableタグへ入れてしまいます。

tableタグの内部で,テーブルの幅をwidth=710 で調節,テーブルの枠をborder=0で無しにすれば,できます。

id:onigiritabetai

ありがとうございます。

2005/12/25 16:41:08
id:kazuspirit No.4

kazuspirit回答回数11ベストアンサー獲得回数02005/12/24 16:34:52

ポイント15pt

 ヤフーのソースを見ると分かりますが、これはスタイルシート(CSS<カスケードファイル>)とDivタグを利用して、幅(width)をピクセルで決めているようです。個人的にはユーザビリティーを重視するなら%で決めるのが良いと思います。


 ヤフーのスタイルシートは人気のようで提示したHPで解説されています。

 ちなみに、ここにヤフーのスタイルシートのファイルがあるような…

http://www.tohoho-web.com/css/index.htm

とほほのスタイルシート入門

ちなみに、私の大学ではこのトホホのwww入門がスタイルシートの勉強がし易いと推奨されました。


※スタイルシートにも著作権が存在するそうなのでヤフーとまったく同じスタイルシート(CSSファイル)を使うのは好ましくないことが起こるかもしれませんよ。

id:onigiritabetai

ありがとうございます。とても参考になります。

2005/12/25 16:41:47
id:Saiya No.5

saiya_moebius回答回数11ベストアンサー獲得回数02005/12/25 03:54:49

ポイント15pt

(URLはダミーです)


質問者さんが、どのような方法でHPを製作されているのかによって答えが大幅に変わるのですが、主にHTML(と呼ばれる物)を直接書くことで製作されているとして、自身のHPなどが特に無いので、ここに書いてみました。

(そうでない場合についても、後ろで言及してあります)

(URLはダミーです)


本題ですが、通常なら<body>タグと、諸々の中身を書く部分を、


<body style=”text-align:center;”>

<div style=”width:710px;text-align:left;”>


<!-- ここに、本来ならbody内部に入る内容を入れて下さい。 -->


</div>

</body>


のようにしてみて下さい。

ブラウザのウインドウを大きくしてみると、左右に隙間が空いているはずです。


また、上の(2行目で「width:710px;」となっている部分の)「710px」で現在(12/25)のyahooと同じ幅ですが、

他の幅にする場合は、「×××px」とすることで一定の幅で、

「××%」とすることで、ウインドウの内幅に対する割合で指定できます。

(URLはダミーです)


また、HPを作成するためのソフトを使っている場合は、ソフトによって具体的な方法が違うため具体的には言い難いのですが、


・文章全体を「中央揃え」に設定

・幅を固定したボックス、ないしは表を一つ置く。

 (表の場合は、列、行ともに一つだけにして、1マスしかない表にして下さい)

・↑で置いたボックス、ないしは表の中に、任意の物を入れる

 (ボックス、ないしは表の中は「左揃え」などにしても構わないはずです)


という風にすることで、おそらく、類似の結果が得られると思います。

id:onigiritabetai

ありがとうございます。とても参考になります。

2005/12/25 16:42:29
id:arcana No.6

arcana回答回数120ベストアンサー獲得回数102005/12/27 16:37:41

ポイント15pt

http://hpb.web-creation.info/d1_bcenter.html

ホームページビルダーを学ぼう『ページの中央表示』

ホームページビルダー用の手順というコトでしたので、

こちらが参考になるでしょうか?

もしくは、こちら:http://www.gokigen-house.com/hp/hpb/hpb09.htm


ちょっと小難しい:http://www.hitobito.net/navipage/con010.asp?navi=hpbuilder_p&...


テーブルの作り方も上記2つのサイトでは記載ありますので、

もしわからなければ、そちらもあわせてご覧下さい。

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません