Dreamweaverで画面サイズを一定にする

締切済

質問者：dai572783
質問日時：2007/06/01 18:34
回答数：3件

こんにちは。
WEBページを表示するパソコンの画面サイズが
1280 x 1024
1024 x 768

のどちらの場合でも、中央揃えになるようにページをデザインしたいのですがどうすればよろしいでしょうか？
例えばYahoo!のトップページは、どちらの画面サイズの場合でも
両端に余白ができるようになっていて、真ん中にページが来ています。
考え方としては真ん中から左右共に512ずつデザインできるようにすればいいのでしょうか？

初心者のためうまく表現できませんが、よろしくお願いします

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： airfriend
回答日時：2008/01/02 16:28

ページを中央に表示するには、CSSでページの横幅を設定して、marginプロパティの左右を「auto」にします。

仮にページのwidthプロパティを800pxにした場合を書いてみます。

コード：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
<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">

</style>
</head>

<body>
<div id="page">
ブラウザに表示させる内容
</div>
</body>
</html>

上記をドリームウィーバーのコードビューに記述してみてください。
ブラウザに表示する内容が中央に表示されているはずです。
コードビューではなく、簡単に設定するには、
ドリームウィーバーの画面の右上側に、CSSパレットがありますので、
「すべてのルール」を右クリック・新規作成、
「新規CSSルール」で詳細設定にチェック、
「セレクタ」を「#page」と入力。
「定義場所」を「現在のドキュメントのみ」にチェックします。
「CSSルール定義画面」が表示されます。
左側の「カテゴリ」の「ボックス」をクリックして選択します。

「幅」に800pxと入力します。
「マージン」では、「すべて同一」のチェックをはずして、
右と左を「自動」とすれば出来ると思います。

つたない説明ですが、わかりましたでしょうか？

参考URL：http://www.webers.jp/movie/dreamweaver/index.html

- 0
- 件

通報する

No.2

回答者： crepon133
回答日時：2007/06/02 18:28

幅750ピクセル程度のボックスやテーブルを中央に配置するだけです。

この回答への補足

具体的にはどういった操作を行えばいいのでしょうか？
ボックスの作り方など教えてください。

補足日時：2007/06/05 18:06

通報する

- 0
- 件

通報する

No.1

回答者： degitalman
回答日時：2007/06/01 22:48

むずかしく考えることはないと思いますが、<body>タグの次に<center>

タグを書き、その下にテーブル等で配置します。
その際、テーブルの幅をヤフーの場合は、710pxにしてあります。（ソースをご覧になるとすぐわかります）
つまり、テーブルの下にまたテーブルを作ったりするにしても、常に幅を710pxというように統一して配置すれば、<center>タグがありますから、全て真ん中に表示されます。

ついでに参考までに。。。
プロが作る場合は、見るユーザーの環境を考えています。1024x768で見る人もいれば、800x600で見る人もいます。（老人の方や遠視の方、障害を持つ方など）
そういう意味で、幅は760px以下で作るのが望ましいです。