什么是 CSS Reset
在开始学习 CSS 的时候，我们会发现每个浏览器的默认样式都不尽相同，这会导致跨浏览器的网页显示差异很大。为了解决这个问题，我们通常会使用 CSS Reset。CSS Reset 是一种 CSS 样式文件，它可以将浏览器的默认样式全部重置为相同的值，从而实现跨浏览器的一致性。
CSS Reset 的问题
虽然 CSS Reset 能够解决跨浏览器的样式问题，但是它也会带来一些问题。首先，CSS Reset 会影响到所有元素，包括 HTML5 中新增的元素，如 section、article 等。其次，CSS Reset 会导致一些样式丢失，比如 button 元素的默认样式。最后，CSS Reset 也会影响到一些浏览器自带的样式，如 Safari 中的 outline 样式。
如何解决 CSS Reset 的问题
选择性使用 CSS Reset
为了避免 CSS Reset 带来的问题，我们可以选择性地使用它。比如，我们可以只针对某些元素使用 CSS Reset，而不是全部元素。这样可以保留一些浏览器自带的样式，同时又能够解决跨浏览器的一致性问题。
使用 Normalize.css
除了 CSS Reset，我们还可以使用 Normalize.css。Normalize.css 是一种 CSS 样式文件，它可以保留浏览器自带的样式，并且在不同浏览器之间达到一致的表现。Normalize.css 不会重置所有元素的样式，而是保留了一些常用元素的样式，比如 h1、p、a 等。同时，Normalize.css 也修复了一些浏览器的 bug，比如 IE6/7 中的一些问题。
自己编写样式
最后，我们也可以自己编写样式，而不使用 CSS Reset 或 Normalize.css。这样可以避免一些样式丢失的问题，并且可以更好地控制网页的样式。当然，这样也需要我们具有一定的 CSS 技能。
示例代码
以下是一个使用 Normalize.css 的示例代码：
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- ----------------- ----- ---------------- -------------------------------------------------------------------------------- ------- -- ---------- -- -------- ------- ------ ---- --------- --- ------- -------展开代码
结论
CSS Reset 能够解决跨浏览器的样式问题，但是它也会带来一些问题。我们可以选择性地使用 CSS Reset，或者使用 Normalize.css，也可以自己编写样式。在实际开发中，我们需要根据具体情况选择最合适的方法，以达到最好的效果。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67778e19c1c5215e3cb90736
