html - html 错误：我说 top:0% 和 left:0% 但浏览器中有空白填充

Question

好吧，这可能是一个新手问题，但这让我非常沮丧。我在样式标签中清楚地说，顶部的蓝色条需要紧贴顶部，两个侧板需要紧贴两侧。

然而由于某种原因，它冒昧地在我的 html 周围插入了一个空白区域。

这是链接： http: //popularn.com/nate/error.html

看到左侧和顶部的空白区域了吗？

即使我说 top:0% 和 left:0%，它仍然不起作用。就好像它在嘲笑我，而我已经受够了。就像它从顶部开始文档：2％和左侧：2％，我无能为力......

Answer 1

从正文中删除边距，将左上角设置为 0，当然不要忘记位置属性

 html,body{padding:0; margin:0;}
 #someElement{position: absolute; top:0; left:0}

也 - 把position:absolute; top:0; left:0;它放在body就像什么都不做position，#top_menu应该是position: fixed而不是fixes没有意义

Answer 2

浏览器有一组默认样式，称为“用户代理样式”。这些是适用于元素的通用 CSS 规则集。你知道当你把一个 H1 放在一个页面上时，它会显得很大，而且是粗体的吗？就是这些风格。

页面中的基本元素都使用这些 UA 规则进行样式设置。正文、HTML、div 等 - 它们都有少量的填充，这就是它的来源。

因此，当您开发超出基本样式时，始终使用 CSS reset是一种很好的做法。我推荐几个不错的。由于 CSS 是分层的（因此是级联的！），您需要首先包含重置。

首先是Eric Meyer 的 CSS reset。这通常适用于所有事物，并且在大多数情况下是不可见的。您包含该文件，所有内容都会重置为基础。

其次是Yahoo UI 3 (YUI) reset，它采用了稍微不同的方法。它们允许您通过包含一个类来选择性地将重置应用于页面的不同区域。这对某些事情很有用，但对于几乎每个中小型项目，我都推荐上面链接的 Eric 的重置 - 但它对于比较和学习很有用。

与其尝试在进行过程中调整不一致 - 使用 CSS 重置将为您提供所有元素的基线，这在每个浏览器上都是相同的。相信我——你想要这个。当您进一步了解 html、表单或类似的有趣内容时，这种东西绝对是救命稻草。

希望有帮助！

Answer 3

您需要在任何浏览器上重置默认填充和边距。我通常使用这个：

*{padding:0;margin:0;}