Question

基于 Eric Meyer's reset 2.0。在整站中推荐使用 normalize 来初始化样式， reset 仅建议在第三方页面局部使用。

依赖于：

• variables
• compatibility

• .global-reset()

  进行全局样式重置。

  // global scope
  .global-reset();

  html,
  body,
  div,
  span,
  applet,
  object,
  iframe,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  blockquote,
  pre,
  a,
  abbr,
  acronym,
  address,
  big,
  cite,
  code,
  del,
  dfn,
  em,
  img,
  ins,
  kbd,
  q,
  s,
  samp,
  small,
  strike,
  strong,
  sub,
  sup,
  tt,
  var,
  dl,
  dt,
  dd,
  ol,
  ul,
  li,
  fieldset,
  form,
  label,
  legend,
  table,
  caption,
  tbody,
  tfoot,
  thead,
  tr,
  th,
  td {
  padding: 0;
  margin: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  
  body {
  line-height: 1;
  }
  
  ol,
  ul {
  list-style: none;
  }
  
  table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
  }
  
  caption,
  th,
  td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
  }
  
  a img {
  border: none;
  }
  
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  menu,
  nav,
  section,
  summary,
  main {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  
  audio,
  canvas,
  video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  }
  
  audio:not([controls]),
  [hidden] {
  display: none;
  }
  

• .nested-reset()

  对选择器指定的元素内部进行样式重置。

  .preview {
  .nested-reset();
  }

  .preview div,
  .preview span,
  .preview object,
  .preview iframe,
  .preview h1,
  .preview h2,
  .preview h3,
  .preview h4,
  .preview h5,
  .preview h6,
  .preview p,
  .preview pre,
  .preview a,
  .preview abbr,
  .preview acronym,
  .preview address,
  .preview code,
  .preview del,
  .preview dfn,
  .preview em,
  .preview img,
  .preview dl,
  .preview dt,
  .preview dd,
  .preview ol,
  .preview ul,
  .preview li,
  .preview fieldset,
  .preview form,
  .preview label,
  .preview legend,
  .preview caption,
  .preview tbody,
  .preview tfoot,
  .preview thead,
  .preview tr {
  padding: 0;
  margin: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  
  .preview table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
  }
  
  .preview caption,
  .preview th,
  .preview td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
  }
  
  .preview a img {
  border: none;
  }
  
  .preview article,
  .preview aside,
  .preview details,
  .preview figcaption,
  .preview figure,
  .preview footer,
  .preview header,
  .preview hgroup,
  .preview menu,
  .preview nav,
  .preview section,
  .preview summary,
  .preview main {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  
  .preview audio,
  .preview canvas,
  .preview video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  }
  
  .preview audio:not([controls]),
  .preview [hidden] {
  display: none;
  }
  

• .reset-box-model()

  重置盒模型。

  .module {
  .reset-box-model();
  }

  .module {
  padding: 0;
  margin: 0;
  border: 0;
  }
  

• .reset-focus()

  重置元素外框线。

  .module {
  .reset-focus();
  }

  .module {
  outline: 0;
  }
  

  IE 下需使用 hidefocus 属性。慎用此功能，可能带来可访问性的损失。

• .reset-font()

  重置字体相关属性。

  span {
  .reset-font();
  }

  span {
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  

• .reset-body()

  重置 body 元素。

  body {
  .reset-body();
  }

  body {
  line-height: 1;
  }
  

• .reset-table()

  重置表格样式。

  table {
  .reset-table();
  }

  table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
  }
  

• .reset-table-cell()

  重置表格单元格样式（td、th）。

  td, th {
  .reset-table-cell();
  }

  td,
  th {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
  }
  

• .reset-list-style()

  重置列表项目符号样式。

  ul, ol {
  .reset-list-style();
  }

  ul,
  ol {
  list-style: none;
  }
  

• .reset-html5()

  重置 HTML5 元素的样式。

  // global scope
  .reset-html5();
  

  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  menu,
  nav,
  section,
  summary,
  main {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  }
  
  audio,
  canvas,
  video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  }
  
  audio:not([controls]),
  [hidden] {
  display: none;
  }