如何在网页顶部显示div背景图片?

时间:2014-01-15 17:52:01

标签: html css alignment

我正在制作导航栏,我遇到了问题。这就是我的导航栏的样子:

enter image description here

它周围有一个8px的白色边框,这就是我想要它的样子:

enter image description here

没有围绕它的8px白色边框。

我正在使用此代码:

.header
{
width: 100%;
height: 80px;
background : #464646;
background : -webkit-gradient(linear, left top, left bottom, from(rgb(168,168,168)), to(rgb(69,69,69)));
background : -moz-linear-gradient(top, rgb(168,168,168), rgb(69,69,69));
border-top:1px solid #939393;
position: relative;
margin-bottom: 30px;
}

我可以用这个:

margin-left:-8px;
margin-right:-8px;
margin-top:-8px;

并将宽度设置为102%,但它会在底部给我滚动条。

这可能令人困惑,但我是初学者,我需要帮助。 如果你能帮助我,我将非常感激!

感谢。

6 个答案:

答案 0 :(得分:2)

您必须将身体上的边距设置为0,如下所示:

body
{
    margin:0;
}

答案 1 :(得分:2)

您的body标记带有边距。那是你的问题。

执行:

body { margin: 0px; }

答案 2 :(得分:2)

用户代理将默认样式应用到您需要覆盖的网页,在这种情况下是margin,因此您可以重置margin

body {
   margin: 0;
}

否则你也可以使用*通用选择器,如

* {
   margin: 0;
   padding: 0;
}

DEMO HERE


要重置正确的样式表,请使用CSS RESET STYLESHEET

答案 3 :(得分:2)

我相信这是因为浏览器有一些默认样式,其中一个是围绕内容的8px边距,查看“css reset”或者如果你只是想删除那一件事尝试

body
{
  margin: 0px;
}

希望有所帮助

答案 4 :(得分:2)

将你的html和正文设置为:

   body, html {padding: 0; margin: 0;}

这将重置所有浏览器并删除边框。

答案 5 :(得分:2)

这将在整个页面上声明不仅仅是身体。

* {
  padding: 0;
  margin: 0;
}

http://jsfiddle.net/cornelas/gwM4X/2/