雅虎css重置

 1 /* YUI 3.8.1 (build 5795) Copyright 2013 Yahoo! Inc. http://yuilibrary.com/license/ */
 2 html {
 3     color: #000;
 4     background: #FFF
 5 }
 6 body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
 7     margin: 0;
 8     padding: 0
 9 }
10 table {
11     border-collapse: collapse;
12     border-spacing: 0
13 }
14 fieldset, img { border: 0 }
15 address, caption, cite, code, dfn, em, strong, th, var {
16     font-style: normal;
17     font-weight: normal
18 }
19 ol, ul { list-style: none }
20 caption, th { text-align: left }
21 h1, h2, h3, h4, h5, h6 {
22     font-size: 100%;
23     font-weight: normal
24 }
25 q:before, q:after { content: '' }
26 abbr, acronym {
27     border: 0;
28     font-variant: normal
29 }
30 sup { vertical-align: text-top }
31 sub { vertical-align: text-bottom }
32 input, textarea, select {
33     font-family: inherit;
34     font-size: inherit;
35     font-weight: inherit
36 }
37 input, textarea, select { *font-size:100%
38 }
39 legend { color: #000 }
40 #yui3-css-stamp.cssreset { display: none }

 

上面是雅虎重置方案，下面看看其他人的重置方案！

 

  1 /* 1.默认色彩 */
  2  /* YUI2 */
  3  html {
  4      /* 不要在reset中设置背景色和字体颜色 */
  5      color: #000;
  6      background: #FFF;
  7  }
  8  
  9  /* 2.边距 */
 10  /* YUI2 */
 11  body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
 12      margin: 0;
 13      padding: 0;
 14  }
 15  /* Alice */
 16  body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td,
 17  hr, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {     /* HTML5 */
 18      margin: 0;
 19      padding: 0;
 20  }
 21  
 22  /* 3.边框 */
 23  /* YUI2 and Alice */
 24  fieldset, img {    /* 去除默认边框 */
 25      border: 0;
 26  }
 27  abbr, acronym {    /* 去掉 Firefox/Safari下此元素的边框  */
 28      border: 0;
 29      font-variant: normal;
 30  }
 31  
 32  /* 4.外边框(outline) */
 33  /* update - 务必重新定义获取焦点后的样式！ */
 34  /* remember to define focus styles! */
 35  :focus {
 36      outline: 0;
 37  }
 38  
 39  /* 5.字体 */
 40  /* 5.1语义 */
 41  /* YUI2 */
 42  address, caption, cite, code, dfn, em, strong, th, var, optgroup {
 43      font-style: inherit;
 44      font-weight: inherit;
 45  }
 46  /* Alice */
 47  address, caption, cite, code, dfn, em, th, var {
 48      font-style: normal;    /* 可自定义之 */
 49      font-weight: 500;    /* 可自定义之 */
 50  }
 51  
 52  /* 5.2字体 - 标题 */
 53  /* YUI2 */
 54  h1, h2, h3, h4, h5, h6 {
 55      font-size: 100%;
 56      font-weight: normal;
 57  }
 58  /* Alice - 来自yahoo, 让标题都自定义, 适应多个系统应用 */
 59  h1,h2,h3,h4,h5,h6 {
 60      font-size:100%;
 61      font-weight:500;    /* 可自定义之 */
 62  }
 63  
 64  /* 5.3字体 - 表单 */
 65  /* YUI2 */
 66  input, button, textarea, select, optgroup, option {    /* 解决表单元素不继承父级 font的问题，但对IE6/7不起作用 */
 67      font-family: inherit;
 68      font-size: inherit;
 69      font-style: inherit;
 70      font-weight: inherit;
 71  }
 72  input, button, textarea, select {
 73      *font-size: 100%;
 74  }
 75  
 76  /* Alice */
 77  body, button, input, select, textarea {/* 解决表单元素不继承父级 font的问题，直接自定义表单字体以解决兼容性问题 */
 78      font: 12px/1.5 tahoma, arial, \5b8b\4f53;
 79  }
 80  button, input, select, textarea {
 81      font-size: 100%;
 82  }
 83  
 84  /* 6.行高(line-height) */
 85  /* Alice */
 86  body, button, input, select, textarea {     /* 行高默认所有元素都会继承的 */
 87      /* IE6下，行高为1时，中文字顶部会被削掉几像素，字体加粗时尤为明显。切记不要置为1 */
 88      font: 12px/1.5 tahoma, arial, \5b8b\4f53;    
 89  }
 90  
 91  /* 7.列表 */
 92  /* YUI2 */
 93  li {
 94      list-style: none;
 95  }
 96  /* Alice */
 97  /* 去掉列表前的标识, li 会继承 */
 98  ol,ul {
 99      list-style:none;
100  }
101  
102  /* 8.表格 */
103  /* YUI2 and Alice */
104  /* 去掉各Table/cell的边距并让其边重合 */
105  table {
106      border-collapse: collapse;
107      border-spacing: 0;
108  }
109  /* 对齐是排版最重要的因素, 别让什么都居中 */
110  caption, th {
111      text-align: left;
112  }
113  
114  /* 9.上下标 */
115  /* YUI2 */
116  sup, sub {
117      vertical-align: baseline;    /* 建议加上font-size: 100%;让重置更加 */
118  }
119  /* Alice - 统一上标和下标 */
120  sub, sup {     /* 可自定义 */
121      font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;
122  }
123  sup {top: -0.5em;}
124  sub {bottom: -0.25em;}
125  
126  /* 10.插入和删除 */
127  /* YUI2 */
128  del, ins { /* 直接清除了ins的下划线和del的删除线 */
129      text-decoration: none;
130  }
131  /* Alice */
132  /* 默认不显示下划线，保持页面简洁 */
133  ins, a {
134      text-decoration:none;
135  }
136  /* 一致的 del 样式 */
137  del {
138      text-decoration:line-through;
139  }
140  
141  /* 11.引用元素的引号 */
142  /* YUI2 and Alice */
143  q:before, q:after {
144      content: '';
145  }
146  /* Eric - 建议 */
147  blockquote, q {
148      quotes: none;
149  }
150  blockquote:before, blockquote:after,
151  q:before, q:after {
152      content: '';
153      content: none;
154  }
155  
156  /* 12.链接 */
157  /* YUI2与Alice都没有设定 */
158  a {     /* 建议去掉下划线，这种方式过于粗糙 */
159      text-decoration: none;
160  }
161  /* 建议使用这种方式去除链接下划线 */
162  :link, :visited {
163      text-decoration: none;
164  }
165  
166  /* 13.其它 */
167  /* Alice */
168  /* ie6 7 8(q) bug 显示为行内表现 */
169  iframe{
170      display:block;
171  }

 

转载于:https://www.cnblogs.com/wanghaibin/articles/2937957.html