HTML背景图像不需要的缩进

时间:2012-04-14 14:03:42

标签: html css background-image

我是HTML的新手;但是我有Objective-C的编程经验,这是我的代码:

<STYLE TYPE="text/css">
  .horiz {
    background-image: url(Banner.png); 
    background-repeat: repeat-x;  
    height:100px; 
  }
</STYLE>

我的banner.png文件是一个1x100的图像,它可以很好地穿过屏幕,但问题是横幅从顶部和左侧缩进几个像素。我不想要这个效果,我已经尝试了位置:relative和top:0px left:0px,我尝试将padding设置为零(但都没有工作)。

基本上,我希望在Twitter上获得类似的效果,它拥抱屏幕的顶部边缘,但我无法弄明白。感谢您抽出时间帮助我!

p.s如果它有所不同,我在我的身体标签中使用了一个标签。

1 个答案:

答案 0 :(得分:1)

您的问题可能与背景无关,实际上是由于身体元素本身的填充造成的,这会阻止您的.horiz元素贴合视口的顶部。

默认情况下,您的HTML文档会设置一些初始样式。其中之一是在<body/>元素上填充。使用重置样式表是常见的做法,例如Eric Meyer提供的样式表。您可以在Chris Coyier的网站上找到它:http://css-tricks.com/snippets/css/meyer-reset/

首先在文档中引用它,然后继续添加所有自定义样式。这样做的另一个方面是规范化各种浏览器供应商之间默认存在的风格差异。