Question

我希望有一个像this这样的网页。

在尝试了一些 CSS 和 HTML 代码之后： CSS代码：

html,body{
    margin:0px;
    background-color:#CCC;
}
#header{
    background-color:#FFF;
    height:350px;
    width:750px;
    display:block;
    }
#menu{
    background-color:#096;
    height:60px;
    width:100%;
    display:block;
}
#content{
    background-color:#03F;
    width:750px;
    height:400px;
    }
#footer{
    background-color:#900;
    height:120px;
    width:750px;
    display:block;
    bottom:0px;
    position:relative;
    }

HTML代码：

<center>
    <div id="header">

    </div>
    <div id="menu">

    </div>
    <div id="content">

    </div>
    <div id="footer">

    </div>
</center>

这是同样的事情，但在将一些文字变成“内容”之后，div分开了。像这样This。

我的 CSS 代码中的问题是什么？

Answer 1

因为p标记有一些默认margin。

像这样添加CSS

p{
margin:0px;
}

Fiddle

强制div垂直相互接触

1 个答案: