css - 如何防止浏览器使用默认样式

Question

所有浏览器都将自己的默认样式应用于 html 元素。这导致在不同浏览器上的观点不同。有什么办法可以防止浏览器这样做吗？

Answer 1

是的，你可以，你需要使用CSS Reset ，这将概括样式，换句话说，它将跨浏览器重置样式。

我个人不使用这些，而是​​使用下面的代码片段，这对我来说已经足够了。

* {
   margin: 0;
   padding: 0;
   outline: 0;
}

如果你想稳定更多的元素，你可以自己制作，比如当用户悬停在你网站上的任何按钮或链接时，你可以使用下面的指针光标。是的，现在这是非常基本的用户体验，比你可以用

button, a, input[type=button], input[type=submit] {
   cursor: pointer;
}

或者说链接不加下划线继承父级颜色，所以我用

a {
   text-decoration: none;
   color: inherit;
}

这种方式你可以自己制作，我更喜欢这种方式。

---

请注意，当我进行响应时，我将 * 片段更改为

* {
   margin: 0;
   padding: 0;
   outline: 0;   
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}

---

Note: Using Reset Stylesheet won't reset any inheritance, it will only reset browser defaults(which won't help you always to make cross browser websites) but will prevent loads of cross browsers issues commonly like padding, margin, line-height, base font etc.