重置浏览器默认样式 normalize.css


1
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 2 3 /* Document 4 ========================================================================== */ 5 6 /** 7 * 1. Correct the line height in all browsers. 8 * 2. Prevent adjustments of font size after orientation changes in iOS. 9 */ 10 11 html { 12 line-height: 1.15; /* 1 */ 13 -webkit-text-size-adjust: 100%; /* 2 */ 14 } 15 16 /* Sections 17 ========================================================================== */ 18 19 /** 20 * Remove the margin in all browsers. 21 */ 22 23 body { 24 margin: 0; 25 } 26 27 /** 28 * Render the `main` element consistently in IE. 29 */ 30 31 main { 32 display: block; 33 } 34 35 /** 36 * Correct the font size and margin on `h1` elements within `section` and 37 * `article` contexts in Chrome, Firefox, and Safari. 38 */ 39 40 h1 { 41 font-size: 2em; 42 margin: 0.67em 0; 43 } 44 45 /* Grouping content 46 ========================================================================== */ 47 48 /** 49 * 1. Add the correct box sizing in Firefox. 50 * 2. Show the overflow in Edge and IE. 51 */ 52 53 hr { 54 box-sizing: content-box; /* 1 */ 55 height: 0; /* 1 */ 56 overflow: visible; /* 2 */ 57 } 58 59 /** 60 * 1. Correct the inheritance and scaling of font size in all browsers. 61 * 2. Correct the odd `em` font sizing in all browsers. 62 */ 63 64 pre { 65 font-family: monospace, monospace; /* 1 */ 66 font-size: 1em; /* 2 */ 67 } 68 69 /* Text-level semantics 70 ========================================================================== */ 71 72 /** 73 * Remove the gray background on active links in IE 10. 74 */ 75 76 a { 77 background-color: transparent; 78 } 79 80 /** 81 * 1. Remove the bottom border in Chrome 57- 82 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 83 */ 84 85 abbr[title] { 86 border-bottom: none; /* 1 */ 87 text-decoration: underline; /* 2 */ 88 text-decoration: underline dotted; /* 2 */ 89 } 90 91 /** 92 * Add the correct font weight in Chrome, Edge, and Safari. 93 */ 94 95 b, 96 strong { 97 font-weight: bolder; 98 } 99 100 /** 101 * 1. Correct the inheritance and scaling of font size in all browsers. 102 * 2. Correct the odd `em` font sizing in all browsers. 103 */ 104 105 code, 106 kbd, 107 samp { 108 font-family: monospace, monospace; /* 1 */ 109 font-size: 1em; /* 2 */ 110 } 111 112 /** 113 * Add the correct font size in all browsers. 114 */ 115 116 small { 117 font-size: 80%; 118 } 119 120 /** 121 * Prevent `sub` and `sup` elements from affecting the line height in 122 * all browsers. 123 */ 124 125 sub, 126 sup { 127 font-size: 75%; 128 line-height: 0; 129 position: relative; 130 vertical-align: baseline; 131 } 132 133 sub { 134 bottom: -0.25em; 135 } 136 137 sup { 138 top: -0.5em; 139 } 140 141 /* Embedded content 142 ========================================================================== */ 143 144 /** 145 * Remove the border on images inside links in IE 10. 146 */ 147 148 img { 149 border-style: none; 150 } 151 152 /* Forms 153 ========================================================================== */ 154 155 /** 156 * 1. Change the font styles in all browsers. 157 * 2. Remove the margin in Firefox and Safari. 158 */ 159 160 button, 161 input, 162 optgroup, 163 select, 164 textarea { 165 font-family: inherit; /* 1 */ 166 font-size: 100%; /* 1 */ 167 line-height: 1.15; /* 1 */ 168 margin: 0; /* 2 */ 169 } 170 171 /** 172 * Show the overflow in IE. 173 * 1. Show the overflow in Edge. 174 */ 175 176 button, 177 input { /* 1 */ 178 overflow: visible; 179 } 180 181 /** 182 * Remove the inheritance of text transform in Edge, Firefox, and IE. 183 * 1. Remove the inheritance of text transform in Firefox. 184 */ 185 186 button, 187 select { /* 1 */ 188 text-transform: none; 189 } 190 191 /** 192 * Correct the inability to style clickable types in iOS and Safari. 193 */ 194 195 button, 196 [type="button"], 197 [type="reset"], 198 [type="submit"] { 199 -webkit-appearance: button; 200 } 201 202 /** 203 * Remove the inner border and padding in Firefox. 204 */ 205 206 button::-moz-focus-inner, 207 [type="button"]::-moz-focus-inner, 208 [type="reset"]::-moz-focus-inner, 209 [type="submit"]::-moz-focus-inner { 210 border-style: none; 211 padding: 0; 212 } 213 214 /** 215 * Restore the focus styles unset by the previous rule. 216 */ 217 218 button:-moz-focusring, 219 [type="button"]:-moz-focusring, 220 [type="reset"]:-moz-focusring, 221 [type="submit"]:-moz-focusring { 222 outline: 1px dotted ButtonText; 223 } 224 225 /** 226 * Correct the padding in Firefox. 227 */ 228 229 fieldset { 230 padding: 0.35em 0.75em 0.625em; 231 } 232 233 /** 234 * 1. Correct the text wrapping in Edge and IE. 235 * 2. Correct the color inheritance from `fieldset` elements in IE. 236 * 3. Remove the padding so developers are not caught out when they zero out 237 * `fieldset` elements in all browsers. 238 */ 239 240 legend { 241 box-sizing: border-box; /* 1 */ 242 color: inherit; /* 2 */ 243 display: table; /* 1 */ 244 max-width: 100%; /* 1 */ 245 padding: 0; /* 3 */ 246 white-space: normal; /* 1 */ 247 } 248 249 /** 250 * Add the correct vertical alignment in Chrome, Firefox, and Opera. 251 */ 252 253 progress { 254 vertical-align: baseline; 255 } 256 257 /** 258 * Remove the default vertical scrollbar in IE 10+. 259 */ 260 261 textarea { 262 overflow: auto; 263 } 264 265 /** 266 * 1. Add the correct box sizing in IE 10. 267 * 2. Remove the padding in IE 10. 268 */ 269 270 [type="checkbox"], 271 [type="radio"] { 272 box-sizing: border-box; /* 1 */ 273 padding: 0; /* 2 */ 274 } 275 276 /** 277 * Correct the cursor style of increment and decrement buttons in Chrome. 278 */ 279 280 [type="number"]::-webkit-inner-spin-button, 281 [type="number"]::-webkit-outer-spin-button { 282 height: auto; 283 } 284 285 /** 286 * 1. Correct the odd appearance in Chrome and Safari. 287 * 2. Correct the outline style in Safari. 288 */ 289 290 [type="search"] { 291 -webkit-appearance: textfield; /* 1 */ 292 outline-offset: -2px; /* 2 */ 293 } 294 295 /** 296 * Remove the inner padding in Chrome and Safari on macOS. 297 */ 298 299 [type="search"]::-webkit-search-decoration { 300 -webkit-appearance: none; 301 } 302 303 /** 304 * 1. Correct the inability to style clickable types in iOS and Safari. 305 * 2. Change font properties to `inherit` in Safari. 306 */ 307 308 ::-webkit-file-upload-button { 309 -webkit-appearance: button; /* 1 */ 310 font: inherit; /* 2 */ 311 } 312 313 /* Interactive 314 ========================================================================== */ 315 316 /* 317 * Add the correct display in Edge, IE 10+, and Firefox. 318 */ 319 320 details { 321 display: block; 322 } 323 324 /* 325 * Add the correct display in all browsers. 326 */ 327 328 summary { 329 display: list-item; 330 } 331 332 /* Misc 333 ========================================================================== */ 334 335 /** 336 * Add the correct display in IE 10+. 337 */ 338 339 template { 340 display: none; 341 } 342 343 /** 344 * Add the correct display in IE 10. 345 */ 346 347 [hidden] { 348 display: none; 349 }

来源:http://necolas.github.io/normalize.css/ 

猜你喜欢

转载自www.cnblogs.com/week-1/p/10399614.html