reset to clear all browser's default style

Original link: https://www.mk2048.com/blog/blog.php?id=h02hikbkjhaa&title=reset%E6%B8%85%E9%99%A4%E6%89%80%E6%9C%89%E6 % B5% 8F% E8% A7 % 88% E5% 99% A8% E9% BB% 98% E8% AE% A4% E6% A0% B7% E5% BC% 8F
Tips

The purpose is not reset to clear the browser's default style, this is only part of the work. Clear and Reset are tight inextricably linked.
The purpose is not to make reset the default style is consistent in all browsers, but to reduce the default style is likely to bring problem.
the RESET is desirable to provide a common set of universal basic style, but has no effect, it is recommended according to specific needs, and then cut and modify.

A. Setting and notes

 
  1. / ** Clear inside and outside margins ** /
  2. body, h1 of, H2, H3, H4, H5, H6, HR, P, blockquote,  / * Structural Elements structural elements * /
  3. DL, dt, dd, UL, OL, Li,  / * List Elements list element * /
  4. pre,  / * Formatting text in text format Elements element * /
  5. form, the fieldset, Legend, Button, INPUT, TextArea,  / * form Elements form element * /
  6. TH, TD  / * Table Elements table elements * / {
  7.     margin: 0;
  8.     padding: 0;
  9. }
  10. / ** * Set the default font /
  11. body,
  12. button, input, select, textarea /* for ie */ {
  13.     font:  14px / 1.5  tahoma, \ 5b8b \ 4f53,  sans-serif;
  14. }
  15. h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal;}
  16. address, auf cite, DFN, EM, var {  font-style:  Normal;}  / * * italics righting /
  17. code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一<a href="https://www.baidu.com/s?wd=等宽字体&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1YLPjcvPvmkPW9WPWRLPj-b0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3En16srjm1rjcL" target="_blank" class="baidu-highlight">等宽字体</a> */
  18. {small  font-size:  12px;}  / * difficult to read in Chinese less than 12px, so small normalize * /
  19. / ** Reset list elements ** /
  20. ul, ol { list-style: none; }
  21. / ** ** reset text element /
  22. a { text-decoration: none; }
  23. a:hover { text-decoration: underline; }
  24. {SUP  Vertical-align = left:  text-Top;}  / * reset, reduce the impact on high line * /
  25. sub { vertical-align: text-bottom; }
  26. / ** ** reset element form /
  27. legend { color: #000; } /* for ie6 */
  28. fieldset, img {  border: 0;}  / * img ride: let no link in the img border * /
  29. Button, INPUT, SELECT, TextArea {  font-size: 100%;}  / * so that form elements inherit the font size ie * /
  30. / * Note: optgroup not righting * /
  31. / ** Reset form elements ** /
  32. table { border-collapse: collapse; border-spacing: 0; }
  33. / * Reset HTML5 element * /
  34. article, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section,
  35. summary, time, mark, audio, video {
  36.     display: block;
  37.     margin: 0;
  38.     padding: 0;
  39. }
  40. mark { background: #ff0; }

II. Practical application code

Recommended site, set a style sheet reset.css clear the default style of each browser, the page has been reached to do to achieve unity in every browser, following the YUI Reset CSS code is posted

 
    1. body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
    2.     margin:0;
    3.     padding:0;
    4. }
    5. table {
    6.     border-collapse:collapse;
    7.     border-spacing:0;
    8. }
    9. fieldset, img {
    10.     border:0;
    11. }
    12. address,caption,cite,code,dfn,em,strong,th,var {
    13.     font-style:normal;
    14.     font-weight:normal;
    15. }
    16. ol,ul {
    17.     list-style:none;
    18. }
    19. caption,th {
    20.     text-align:left;
    21. }
    22. h1, h2, h3, h4, h5, h6 {
    23.     font-size:100%;
    24.     font-weight:normal;
    25. }
    26. q:before,q:after {
    27.     content:'';
    28. }
    29. abbr,acronym {
    30.     border:0;
    31. }

More professional front-end knowledge, make the [2048] ape www.mk2048.com

Guess you like

Origin blog.csdn.net/qq_45670012/article/details/102754639