• 締切済み

既存のHPを中央寄せ

宜しくお願いいたします。 自分でHPを作成したのですが（HPビルダー） たとえば、ウインドウを狭くすると画像や文字も隠れてしまいます。 ウインドウの大きさを変えても常に自動的に画面の中央に表示される ようにするにはどうしたらよいですか？

  • HTML
  • 回答数8
  • ありがとう数5

みんなの回答

  • d-3
  • ベストアンサー率42% (16/38)
回答No.8

ビルダー使ったこと無いので、細かいことはわからないですが >たとえば、ウインドウを狭くすると画像や文字も隠れてしまいます。 表や段落の幅を絶対指定（pxやcm）してないでしょうか。 例えば、表（table）の幅を600pxで指定すると、ウィンドウ幅を600px以下にした場合、当然表示できない部分は隠れます。 このような場合は表や段落の幅を%で指定するといいと思います。 例えば80%にした場合は、表や段落の幅は常にウィンドウの幅の80%になり、中身の文字もそれに応じて折り返されて表示されます。 画像は折り返しできませんので、ウインドウを画像の横幅より小さくすると、表示しきれない部分は隠れます。これは画像を小さく載せるしかないと思います。 特に幅を指定しなかった場合は、段落の場合ウインドウ幅100%、表の場合は内容が収まる最小限の大きさになります。（ブラウザによって違うかもしれません） おすすめは、表や段落には横幅を指定せず。本文全体（BODY）に余白を設定して見栄えを整えることです。 例えば <body style="margin: 0 4%;"> と指定すれば、そのページの本文はウィンドウの幅がどのような大きさでも、左右に4%の余白を持ってレンダリングされます。 余白の大きさは好みに合わせて変えてください。 外部スタイルシートを使うと上のようなものを含む見栄えに関する様々な設定を、全ページに適用することができるので楽です。 ここで書くと長くなるので、検索などを駆使して調べてみてください。

  • the845t
  • ベストアンサー率33% (246/743)
回答No.7

縦でも中央というのであれば、 私はJavaScriptを使い、ウィンドウの高さを取得し、 その「高さ－若干のマージン」を利用しています。 テーブルを利用し、さらにvalign=centerとすることで、 縦でも中央になります。 JavaScriptですから、JavaScriptを切ってる人や、対応していないブラウザでは使えません。 また、ウィンドウを変更してもすぐに反映されるわけではなく、 再読み込みすることでその大きさに変更されます。 もっとも、私は中央に持ってくるのではなく、 画面いっぱいを利用することを目的として使用しています。

noname#199778
noname#199778
回答No.6

HTMLのタグを直接テキストエディタ等で書き換えるとしたらの話ですが、 ウィンドウの大きさを変えても常に自動的に画面の中央に画像や文字が表示されるようにする方法としては、中央揃えにしたい部分を ・<center></center>で囲う ・<div align="center"></div>で囲う ・対象のタグにalign="center"を追記する (例：<p align="center">～</p>) ・スタイルシートを利用する(対象のタグにstyle="text-align: center;"を追加する(例：<p style="text-align: center;">～</p>)など) などの方法があります。 一般的にはこれらの方法でうまくいくと思います。 個人的にはtableを利用するのはお勧めしないんですが、tableタグを利用する場合は <table> <tr> <td align="center">内容</td> </tr> </table> のようにすれば、一応中央揃えで表示できます。 ただし、表示内容の幅がテーブルで指定している横幅を超える場合(画像の横幅が指定したテーブル幅より大きい時や、改行できない半角英数字が長く連なっている場合)、テーブルの横幅が指定した横幅よりも大きくなることがあります。 その場合、テーブル幅がブラウザの横幅を超えてしまうと、表示内容がブラウザの横幅からはみ出て、すべて中央から右側にずれて表示されることになります。 参考になれば幸いです。

回答No.5

コンニチワ。 <table width="80%" border="0" cellpadding="0" cellspacing="0"> <tr> <td> 画像や文字など </td> </tr> </table> 上のようなタグを打ち込んで、「画像や文字など」の部分に、その文字や画像を入れてください。 table width="80%" が、ミソです。この場合は、ブラウザの横幅に対して8割のテーブルが描かれることになるので、その間にオブジェクトが収まります。 これでお分かりいただけるでしょうか？

回答No.4

はじめまして。 HP を組み立てている HTML タグですが、 TABLE タグ、TR タグ、TD タグというのを基本に使って作り、 そのタグのなかでできるレイアウトの大きさの指定を ピクセルではなく、パーセントで指定することで、 ウィンドウの大きさの変更に柔軟に対応するページが つくれると思います。 タグの詳しいことは参考書などを手に入れたほうが いつも見られるので便利です。 うまくやれば、ウィンドウを狭くする = 小さいモニタで 見る人も、よく見られるページになりますね。 がんばってみてください。

  • shy00
  • ベストアンサー率34% (2081/5977)
回答No.3

全体を真ん中に配置したい場合は <div align="centre"> 文字など入力 </div> で、ブラウザー表示の真ん中に配置されます。 　（ブラウザーのサイズを変更しても） タグ覚えてしまうと、ビルダー使うよりも 早く作れますよ（笑）

  • toma9
  • ベストアンサー率47% (673/1425)
回答No.2

＞その方法以外になにかあるんでしょうか？？ HTMLソースは知ってますか？ TABLE内のセル内の文字列を列の中央に置きたいのでしたら… <TABLE> <TR> <TD ALIGN="CENTER"> //文字列 </TD> </TR> </TABLE> となります。 ソースの表示はHP上で右クリックで見る事が出来ます。 ビルダー上なら 「HTMLソースの表示」をクリックすればでます。 自分がしたい内容のHPがあるのなら、HTMLソースを参考にすると勉強になります。 その気がありましたら勉強して損はないでしょうね。 ただ、私はそこまで勉強してませんが…(~_~;) 以下参考サイトです。 HPお役立ち小技集 http://www.sky.sannet.ne.jp/masapine/homepage/ ホームページ作成支援/HTML学校/HTMLタグ辞典 http://www.pixel.co.jp/

参考URL：
http://www.pixel.co.jp/
  • toma9
  • ベストアンサー率47% (673/1425)
回答No.1

HPビルダーの「どこでも配置モード」でHPを作成でしょうか？ 「標準モ－ド」にして「中央揃え」を設定するとうまく表示するはずです。

midoricya
質問者

補足

ありがとうございます。 例えばなんですが、その方法以外になにかあるんでしょうか？？ ビルダーなどを使ってない人はどうしてるのでしょうか・・。 それ以外に方法があったらお願いします。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVE セレクト

質問する