![如何用css设置网页字体[多图]](/aiimages/%E5%A6%82%E4%BD%95%E7%94%A8css%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E5%AD%97%E4%BD%93%5B%E5%A4%9A%E5%9B%BE%5D.png)
另一方面，滥用 CSS reset 导致一些问题：
1.
不当的破坏了所有浏览器的基本样式。最典型的混蛋做法就是将所有元素的margin/padding设为0，及去掉ol/ul的列表样式，去掉h1~h6
的字体大小样式。这导致blockquote、ol、ul、hn等语义元素在没有赋以其他合理的样式时（常常如此），缺乏恰当的样式展现。而因为视觉上无
法区分，这进一步导致许多开发人员忽视或误用这些语义元素，并严重破坏团队内其他希望使用语义元素的开发人员的工作流程。
2.
浏览器为配合控件风格，或出于可用性和无障碍性考虑，会有一些特定的默认样式。如一些浏览器对于 input[type=radio] 默认有
margin，以确保单选框的外观比较协调。粗暴的reset导致控件外观可能在特定浏览器下失调。又如大部分交互控件在获得焦点时有虚线
outline。去掉这样式而又不提供其他对于焦点的视觉反馈机制（常常如此）可能导致可用性和无障碍性问题。
3. 某些use case中，网页中有有一些较高独立性的部分，比如内嵌编辑器、widget、第三方内容等，CSS reset导致这部分的样式常需要完全重新覆写，而这种覆写本来可能大部分是不必要的，令人烦躁且可能遗漏。参考此问答：怎样不让 CSS reset 样式覆盖掉编辑器内的文章样式？
4.
CSS reset
通常会增加浏览器进行样式计算的成本（即有一定的性能负担），因为它引入了许多的针对元素的全局规则，网页中几乎所有元素都会匹配一条乃至几条的
reset规则，且往往规则中的属性设定其实会被更specific的规则所覆盖（比如padding和margin）。极端情况下，可能某条reset
规则中的所有属性设置实际上并没有在任何元素上生效（因为全部被更specific的规则给覆盖了），所有针对此规则的级联计算全都是浪费。
注意一点，导致这些问题共通的本质性因素是：CSS reset 的作用是全局性的（即缺乏选择器限定范围）。所有合格的程序员都知道避免滥用全局变量，但是在 CSS 上他们就忘记了这一点。
因此，除了上述4点所提到的问题，从可维护性上来看，所有全局变量可能导致的维护性噩梦也会以类似的方式发生在 CSS reset 上。比如一旦引入了 CSS reset，当项目规模大到一定程度，要再想把 CSS reset 从项目中去掉，就十分困难。
解决方法：
1. 不使用 CSS reset，或使用那些谨慎的，只是用来消除浏览器默认样式不一致的真正的 CSS reset（更准确的称谓或许是 CSS normalize，参考此问答：Normalize.css 与传统的 CSS Reset 有哪些区别？）。
2. 对于特定的reset需求，只在真正需要的时候，单独设置。若要提高代码复用程度，可以引入CSS预处理，以mixin来做。例子：
@mixin reset-box() {
list-style: none
padding: 0
margin: 0
}
@mixin reset-font() {
font-size: 1em
font-weight: normal
font-style: normal
}
//真正用的场景
html#示例网站 {
nav#全站导航条 ul {
border: 1px solid
+reset-box()
}
section.侧栏模块 {
border: 1px solid
h1 {
background: navy
color: white
border-bottom: 1px solid
+reset-box()
+reset-font()
}
}
}
（以上以伪代码书写，请自行脑补转换为 SASS/Stylus/LESS 等。）
3. 对于已经使用 CSS reset 的同学，可以籍由支持局部 import 的 CSS 预处理器（比如 stylus）的帮助，从限定其在特定 selector 之下开始，逐步控制其影响范围。如：
html#示例网站 {
... // 不依赖 CSS reset 的部分
.legacy-part { // 页面中仍依赖 CSS reset 的部分
@import 'reset.css'
}
}
最后顺带说下，CSS 3 已加入 unset 关键字和 all 快捷属性（目前仅 Firefox 支持），可以更好的支持必要的 reset 需求。
以上。
补充：
有些同学认为“没有那种很傻叉的重置的话，我觉得都算不上是滥用”。问题在于，怎么样算是“傻叉重置”？团队里的每个人对此认识一致吗？将来新人进入老人离开，还能保持对此认识一致吗？
除
了非常明确的使用 normalize.css 之类的既定方案的情况，许多团队常见自行 customize 一个 reset.css 或混合了
reset 的 base.css。这种情况下，随着时间流逝最可能出现的情形就是此 css
会逐渐混入了更多的全局性的样式（因为合格的程序员都有增强复用性的冲动），从而陷入之前说的那些问题。因此，未雨绸缪的做法，就是一开始就避免使用
CSS reset，或严格明确和限定其作用（如 normalize 的方式）。
就是重置css样式，也可以说是初始化css样式。因为浏览器的品种很多，每个浏览器的默认样式也是不同的，比如<button>标签，在IE浏览器、Firefox浏览器以及Safari浏览器中的样式都是不同的，所以，通过重置button标签的CSS属性，然后再将它统一定义，就可以产生相同的显示效果。
如
*
{
padding:
0
margin:
0
border:
0
}这也算是一个css
reset只是效率低不推荐!
