- 締切済み
Dreamweaverで画面サイズを一定にする
こんにちは。 WEBページを表示するパソコンの画面サイズが 1280 x 1024 1024 x 768 のどちらの場合でも、中央揃えになるようにページをデザインしたいのですがどうすればよろしいでしょうか? 例えばYahoo!のトップページは、どちらの画面サイズの場合でも 両端に余白ができるようになっていて、真ん中にページが来ています。 考え方としては真ん中から左右共に512ずつデザインできるようにすればいいのでしょうか? 初心者のためうまく表現できませんが、よろしくお願いします
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- airfriend
- ベストアンサー率0% (0/0)
ページを中央に表示するには、CSSでページの横幅を設定して、marginプロパティの左右を「auto」にします。 仮にページのwidthプロパティを800pxにした場合を書いてみます。 コード: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>ページタイトル</title> <style type="text/css"> <!-- #page { width: 800px; margin-right: auto; margin-left: auto; } --> </style> </head> <body> <div id="page"> ブラウザに表示させる内容 </div> </body> </html> 上記をドリームウィーバーのコードビューに記述してみてください。 ブラウザに表示する内容が中央に表示されているはずです。 コードビューではなく、簡単に設定するには、 ドリームウィーバーの画面の右上側に、CSSパレットがありますので、 「すべてのルール」を右クリック・新規作成、 「新規CSSルール」で詳細設定にチェック、 「セレクタ」を「#page」と入力。 「定義場所」を「現在のドキュメントのみ」にチェックします。 「CSSルール定義画面」が表示されます。 左側の「カテゴリ」の「ボックス」をクリックして選択します。 「幅」に800pxと入力します。 「マージン」では、「すべて同一」のチェックをはずして、 右と左を「自動」とすれば出来ると思います。 つたない説明ですが、わかりましたでしょうか?
- crepon133
- ベストアンサー率51% (399/776)
幅750ピクセル程度のボックスやテーブルを中央に配置するだけです。
- degitalman
- ベストアンサー率60% (15/25)
むずかしく考えることはないと思いますが、<body>タグの次に<center> タグを書き、その下にテーブル等で配置します。 その際、テーブルの幅をヤフーの場合は、710pxにしてあります。(ソースをご覧になるとすぐわかります) つまり、テーブルの下にまたテーブルを作ったりするにしても、常に幅を710pxというように統一して配置すれば、<center>タグがありますから、全て真ん中に表示されます。 ついでに参考までに。。。 プロが作る場合は、見るユーザーの環境を考えています。1024x768で見る人もいれば、800x600で見る人もいます。(老人の方や遠視の方、障害を持つ方など) そういう意味で、幅は760px以下で作るのが望ましいです。
補足
具体的にはどういった操作を行えばいいのでしょうか? ボックスの作り方など教えてください。