HTML 背景图像不需要的缩进

Question

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

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

我的 banner.png 文件是一个 1x100 的图像，它可以很好地穿过屏幕，但问题是横幅从顶部缩进并向左缩进几个像素。我不想要这种效果，我试过 position:relative 和 top:0px left:0px，我试过将 padding 全部设置为零(但都没有用)。

基本上，我想实现与 Twitter 顶部栏类似的效果，它紧贴屏幕的顶部边缘，但我无法弄清楚。感谢您花时间帮助我!

p.s 如果有什么不同，我在我的正文标签中使用了一个标签。

Answer 1

您的问题可能与背景无关，实际上是由 body 元素本身的填充引起的，这将阻止您的 .horiz使元素紧贴视口(viewport)顶部。

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

只需在您的文档中首先引用它，然后继续添加您自己的所有自定义样式。这样做的另一件事是标准化不同浏览器供应商之间默认存在的风格差异。