1

XHTML 1.0 Transitional doctype html ファイルを使用しています。幅 800px のメイン div を作成し、中央に配置したいと考えています (div コンテンツではなく、div 自体)。

私は過去にこれを使用しました:

<!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>
        <title></title>
        <style>
            <!--
            html, body { margin:0; padding:0; }

            #main-container { background:black; width:800px; }
            -->
        </style>
    </head>
    <body>
        <center>
            <div id="main-container">
                Content
            </div>
        </center>
    </body>
</html>

しかし、これがブラウザ間の互換性があるかどうか、または有効な xhtml であるかどうかはわかりません。

4

4 に答える 4

5

このcenterタグは 1998 年に非推奨になりmargin 0 auto;ました。div に CSS を適用する必要があります。これにより、上マージンと下マージンが設定され0、左マージンと右マージンが既知/修正されautoたときにdiv自体が「自動中央」になります。width

以下も参照してください。

于 2011-01-08T21:45:06.757 に答える
1

タグを削除し、centerこの css 宣言を設定します

#main-container { margin: auto; width:800px }
于 2011-01-08T21:45:29.573 に答える
0

margin: 0 auto;上記のように、を使用します。

<style type="text/css">
html, body {
  margin: 0;
  padding: 0;
}
#main-container {
  background: black;
  width: 800px;
  margin: 0 auto;
}
</style>

ところで、適切な XHTML として検証したい場合はtype="text/css"、スタイル要素に追加する必要があります。さらに、現在ほとんどすべてのブラウザーが CSS をサポートしているため、古いブラウザーから CSS を隠す必要はほとんどありません。

于 2011-03-27T22:18:22.167 に答える
0

使用できます

#container{
    position:relative;
    margin: auto;
}

または、コンテナの幅が固定されている場合は、800pxとしましょう。次のようなことができます

#container{
    position:relative;
    left: -400px;
    margin-left: 50%;
}
于 2011-01-08T21:48:53.230 に答える