以下のサイトを参考にしたのですが、
解決しませんでした。
使い方が、間違っているのでしょうか。
http://www.mozilla.gr.jp/standards/webtips0004.html
bodyの直ぐ下に<center>を入れれば、全体的に真ん中の表示になります。
おお!なりました!
でもなぜかHPビルダーでは、「エラーが検出されましたので修正しました」とでました。
うまく表示されたには変わらないのですが。。
<body>
<center>
.
.
.
</center>
</body>
が一般的で、簡単ですね。どんなブラウザでも効きます。
もしくは、
<body>
<div align=”center”>
.
.
.
</div>
</body>
でも大丈夫です。
ありがとうございます。
CSSは特別必要ないのですね。
http://www.1uphp.com/con2/layout/bodycenter.html
ページ全体を中央に表示(センタリング) - WEBサイト作成 フリー素材コード の1uphp.com スタイルシート,htmlやFirefox,Operaなどのブラウザの表示結果まで。
そちらで、大半は間違ってないと思います。
中央寄せは、ブラウザ別の問題と、ドキュメントバージョンの宣言の仕方に注意が必要な様です。
『ページ全体を中央に表示(センタリング)』との紹介がありました。
ありがとうございます。
例えば、下記のようなページでしょうか↓
<html><head>
<title>中央合わせ</title>
</head>
<body leftmargin=”0” topmargin=”0” marginwidth=”0” marginheight=”0”>
<table width=710 border=0 cellspacing=0 cellpadding=0 bgcolor=”#ffffcc” height=”100%” align=”center”>
<tr>
<td valign=”top”>
ここに本文を作ります。
例えば、<a href=”http://www.yahoo.co.jp/” target=”_blank”>YAHOOのトップページ</a>では、
table タグを使って、このような感じで、
センター合わせしています。
</td>
</tr>
</table>
</body>
</html>
下記サイトもご参考に↓
ご丁寧にありがとうございます!
http://www.mozilla.gr.jp/standards/webtips0004.html
ブロックレベル要素をセンタリングする方法 - Web標準普及プロジェクト
ポイントは、ブロックレベル要素に対して必ずwidthを設定する、という点。これが無いとセンターにきません。
例えば、こんな感じにするととりあえずセンターにもってくることはできます。
body {
width:600px; /* この数値は適当に変更しても大丈夫 */
margin:0 auto;
}
http://www.w3.org/TR/CSS21/box.html
Box model
ありがとうございます。
bodyのあとにcenterをいれて
効果がある場合とない場合がありますね。
CSSも効果がない場合が…。
フラッシュを多用するときかないこと等
はありますでしょうか?
HPビルダーで配置すると
position absoluteがついてしまうから
でしょうか?
しかし、それを消すだけですと、配置がばらばらになってしまいます。。
kuma-ismさんが参考にされたWEBページを注意深く読めば
多分わかると思います。
>全体のレイアウトを<div id= >
>としましてCSSで、margin: 0px auto;
>としました。あとはbodyをtext-align:center;
>としました。
基本的にはそれで合っていますが、
divにwidth(横幅)が指定されていないので
全体を中央に寄せつつ文章は左寄せされていることが
分かり辛いだけです。
Mozilla系などのブラウザではkuma-ismさんの記述に
divにwidth:70%;など適当な横幅指定をすればよいです。
一方、IEはmargin:0 auto;のような指定は「知らない」ので
無視します。ですがtext-align:center;で、本来は
動いてはいけない大きな囲み(divなどの「ブロック要素」)
をも中央に動かします。これを利用します。
下にソースを載せますので試してみてください。
divのidはmainにしました。
また、わかりやすいようにborderをつけています。
(全角になっている記号は半角にして下さい)
<html>
<head>
<style>
body{
text-align:center;
}
div#main{
width:70%;
margin:0 auto;
border:1px solid black;
text-align:justify;
}
</style>
<title>test</title>
</head>
<body>
<div id=”main”>てすとです</div>
</body>
</html>
初心者のためもう少し詳しくお教え頂けますでしょうか。。。すいません。本を参考にして
全体のレイアウトを
としましてCSSで、margin: 0px auto;
としました。あとはbodyをtext-align:center;
としました。が、うまくいきませんでした。