1つの大きな中央に配置された「すべての」div内にいくつかの絶対配置されたdivコンテナーを配置します。これは、ブラウザーの中央に配置できるように相対位置を設定する必要があります。これにより、内部のdivを完全に制御しながら、次のことが可能になります。ページを中央に配置します。私はこれをやってみました：
<body>
<div id="all">
<div id="header"></div>
<div id="main"></div>
<div id="footer"></div>
</div>
</body>
これをcssとして：
#all
{
background-color:#ffffff;
margin-left:auto;
margin-right:auto;
width:1000px;
height:1300px;
}
#header
{
background-color:#ff0000;
position:absolute;
top:0px;
left:0px;
width:1000px;
height:200px;
}
#main
{
background-color:#00ff00;
position:absolute;
top:200px;
left:0px;
width:1000px;
height:1000px;
}
#footer
{
background-color:#0000ff;
position:absolute;
top:1200px;
left:0px;
width:1000px;
height:100px;
}
ただし、＃header、＃main、および#footerはすべて分離されており、上部と左側が中央に配置されておらず、親div #allから完全に分離されています。これは、＃allが本来のように中央に配置されているためです。誰かがこれが起こっている理由を説明し、私に修正を教えてもらえますか？