前言 上一章节我们对normalize.css源码进行解析，但是由于其代码过长导致不宜浏览，所以表单forms，表格table部分内容放在此章节介绍。本章节会完成所有源代码翻译整理，最终会整理出normalize-zh.css中文版本并开源至github供大家交流使用。
回顾：关于css reset 那些事（二）之 normalize.css 源码解读
normalize 源码解读 (2) 上章节对 html与body元素，html5元素，链接，语义化文本，内嵌元素，群组元素 等源码内容已经做了解析，这章节继续完成表单forms，表格table部分。
源码地址：https://github.com/necolas/normalize.css/blob/master/normalize.css
源码版本：v3.0.3
表单 forms /** * 1. correct color not being inherited. * known issue: affects color of disabled elements. * 2. correct font properties not being inherited. * 3. address margins set differently in firefox 4+, safari, and chrome. */button,input,optgroup,select,textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */}
修正所有浏览器中颜色不继承的问题 修正所有浏览器中字体不继承的问题 修正 firefox 3+， safari5 和 chrome 中外边距不同的问题 有一些浏览器会把form表单中的一些元素 textarea，text，button，select 中的字体和字体颜色默认会设置成用户的字体或者是浏览器的字体，并不会从父元素继承，所以这里重置了这些元素的默认样式。
/** * address `overflow` set to `hidden` in ie 8/9/10/11. */button { overflow: visible;}
统一 ie 8/9/10/11 overflow属性为visible 在 ie 8/9/10/11里的button默认的overflow是hidden，这里统一为visible
/** * address inconsistent `text-transform` inheritance for `button` and `select`. * all other form control elements do not inherit `text-transform` values. * correct `button` style inheritance in firefox, ie 8/9/10/11, and opera. * correct `select` style inheritance in firefox. */button,select { text-transform: none;}
统一各浏览器text-transform不会继承的问题 /** * 1. avoid the webkit bug in android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. correct inability to style clickable `input` types in ios. * 3. improve usability and consistency of cursor style between image-type * `input` and others. */button,html input[type=button], /* 1 */input[type=reset],input[type=submit] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */}
避免 android 4.0.* 中的 webkit bug ，该bug会破坏原生的audio和video的控制器 更正 ios 中无法设置可点击的input的问题 统一其他类型的input的光标样式 这里将可点击的按钮，统一设置鼠标样式为pointer，提高了可用性
/** * re-set default cursor for disabled elements. */button[disabled],html input[disabled] { cursor: default;}
重置按钮禁用时光标样式 /** * remove inner padding and border in firefox 4+. */button::-moz-focus-inner,input::-moz-focus-inner { border: 0; padding: 0;}
移除 firefox 4+ 的内边距 /** * address firefox 4+ setting `line-height` on `input` using `!important` in * the ua stylesheet. */input { line-height: normal;}
统一设置行高为normal firefox浏览器会默认设置input[type=button]的行高为normal !important，这里统一样式
/** * it's recommended that you don't attempt to style these elements. * firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. address box sizing set to `content-box` in ie 8/9/10. * 2. remove excess padding in ie 8/9/10. */input[type=checkbox],input[type=radio] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */}
修正 ie 8/9 box-sizing 被设置为content-box的问题 移除 ie 8/9 中多余的内边距 /** * fix the cursor style for chrome's increment/decrement buttons. for certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button { height: auto;}
修正 chrome 中 input [type=number] 在特定高度和 font-size 时,下面一个箭头光标变成cursor: text 效果 /** * 1. address `appearance` set to `searchfield` in safari and chrome. * 2. address `box-sizing` set to `border-box` in safari and chrome. */input[type=search] { -webkit-appearance: textfield; /* 1 */ box-sizing: content-box; /* 2 */}
修正 safari 5 和 chrome 中appearance被设置为searchfield的问题 修正 safari 5 和 chrome 中box-sizing被设置为border-box的问题 searchfield是css3的属性，它可以让一个div元素看上去像任何元素，但是浏览器支持性并不好，
/** * remove inner padding and search cancel button in safari and chrome on os x. * safari (but not chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration { -webkit-appearance: none;}
移除原生默认样式，统一search的输入框样式 /** * define consistent border, margin, and padding. */fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
定义一致的边框、外边距和内边距 /** * 1. correct `color` not being inherited in ie 8/9/10/11. * 2. remove padding so people aren't caught out if they zero out fieldsets. */legend { border: 0; /* 1 */ padding: 0; /* 2 */}
修正 ie 6-9 中颜色不能继承的问题 重置内边距 /** * remove default vertical scrollbar in ie 8/9/10/11. */textarea { overflow: auto;}
移除 ie8-11 中默认的垂直滚动条 /** * don't inherit the `font-weight` (applied by a rule above). * note: the default cannot safely be changed in chrome and safari on os x. */optgroup { font-weight: bold;}
统一设置optgroup元素font-weight始终为bold 表格 tables /** * remove most spacing between table cells. */table { border-collapse: collapse; border-spacing: 0;}td,th { padding: 0;}
normalize-zh.css 出炉 normalize-zh.css是根据对normalize.css的源码分析后，经过学习与整理，将源代码中的英文注释文档翻译为中文版本，方便国内的开发者学习和使用，我深知此版本一定有很多不足，希望能得到大家的理解和支持，同样也很愿意和大家一起完善。
现已将源代码开源至github
项目地址：https://github.com/alsiso/normalize-zh
总结 经过两个章节对normalize.css的源码进行了学习，清晰的了解了它的工作原理，作为传统css reset替代者，它当之无愧，为大家提供一套很完整的跨浏览器解决方案。
不过，你是否会有和我一样的需求，比如开发一个小站，或者一个pc端的系统时，也许只需要一些简单的基础模块，比如我只想要简单的样式重置，统一各浏览器的效果就好，并不需要html5以及css3的一些问题修复。
那么下一章，我们来介绍，如果制定属于自己的 css基础代码库？