如果您 * 可以 * 编辑违规样式表

如果用户代理样式表的样式导致了它应该修复的浏览器的问题，那么你可以尝试删除违规的样式并进行测试，以确保它不会在其他地方产生任何意想不到的负面影响。
如果没有，请使用修改后的样式表。修复浏览器的怪癖是这些工作表的目的--它们修复问题，而不是引入新的问题。

无法编辑违规样式表

如果您无法编辑包含违规行的样式表，您可以考虑使用!important关键字。
举个例子：

.override {
    border: 1px solid #000 !important;
}

.a_class {
    border: 2px solid red;
}

HTML：

<p class="a_class">content will have 2px red border</p>
<p class="override a_class">content will have 1px black border</p>

Live example
尽量只在真正需要的地方使用!important--如果你能重新组织你的样式，这样你就不需要它了，这会更好。

不，它不是。使用Meyers CSS reset：）http://meyerweb.com/eric/tools/css/reset/

我不明白为什么没有人指出具体问题，有些答案完全是误导性的，尤其是公认的答案。问题是OP没有选择可能覆盖用户代理（UA）直接在ul标记上设置的margin属性的规则。让我们考虑OP使用的所有带有margin属性的规则。

body {

margin:0px;
...
}

body元素位于DOM的上方，UA规则匹配下面的元素，因此UA获胜。这就是遗传的方式。继承是一种方法，在没有来自CSS级联应用的任何源的任何特定声明的情况下，从其父元素获得元素的属性值。父元素的特定性是无用的，因为UA规则直接匹配元素。

#mainNav{
    margin:0 auto;
    ...
}

这是一个更好的尝试，一个更具体的选择器#mainNav，它匹配DOM中较低的mainNav元素，但同样的原则适用，因为ul元素仍然在DOM中这个元素之下。

#mainNav ul li{
    ...
    margin:0;
    ...
}

这太过分了！现在，选择器匹配li元素，它位于ul元素下面。
因此，假设UA规则使用选择器ul而不是!important，这是最有可能的情况，解决方案将是一个简单的ul { margin: 0; }，但更安全的是使其更具体，比如#mainNav ul { margin: 0 }。

把这个放在你的index.html的“头”中

<style>
  html body{
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: 0;
  }
  </style>

您在自己的样式表中编写的所有内容都会覆盖用户代理样式-这就是编写自己的样式表的意义所在。

我有同样的问题，但没有任何工作。我所做的就是把这个添加到选择器中：

-webkit-appearance: none;
-moz-appearance: none;
appearance: none;