What is CSS reset? Some colleagues call it "css reset", and some may call it "Default CSS ".....
I believe that after reading the full text, you will have a new understanding of CSS reset.
Original article address:
Http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css-reset-styles/
PS:
*{ padding:0; margin:0; }
This is the most common CSS reset, but there are many problems here.
The front part of the original article describes many differences between CSS and CSS rules of different browsers, and the development of "cssreset" is also for compatibility and unification, correct and effective use of "css reset" can save time and money to some extent.
Thank you very much for sorting out and summarizing perishable.
The following is a brief introduction to several types of CSS reset. I have limited capabilities. I can only understand what it means. Please forgive me.
Minimalistic reset [version 1]
I believe you often see this section, and it is also frequently used by us.
*{
Padding: 0;
Margin: 0;
}
Minimalistic reset [version 2]
Border: the design of 0 is somewhat unreliable.
Source: (http://blog.sina.com.cn/s/blog_5d8975f30100f7j6.html)-CSS reset (reset) finishing _ moyu _ Sina Blog
*{ padding:0; margin:0; border:0; }
Minimalistic reset [Version 3]
Of course, this is not recommended. It will conflict with some default styles.
*{ outline:0; padding:0; margin:0; border:0; }
Condensed universal Reset
This is a method that the author is interested in, ensuring the uniformity of the general Browser style.
*{ vertical-align:baselinebaseline; font-weight:inherit; font-family:inherit; font-style:inherit; font-size:100%; border: 0none; outline:0; padding:0; margin:0; }
Poor man's reset
In fact, this is also a common type of CSS reset. It resets the font size and processes the border of image links.
It is often seen on some sites
html, body{ padding:0; margin:0; } html { font-size:1em; } body { font-size:100%; } a img, :link img, :visited img{ border:0; }
Shaun Inman's global Reset
The author believes that the CSS reset written by Shaun has a certain purpose.
In addition, these rules target some important common browsers.
Such as IE and Firefox
body, div, dl, dt, dd, ul, ol, li, h1, h2,h3, h4, h5, h6,pre, form, fieldset, input, p, blockquote, table, th, td, embed, object{ padding:0; margin:0; } table { border-collapse:collapse; border-spacing:0; } fieldset, img, abbr{ border:0; } address, caption, cite, code, dfn,em, h1, h2, h3, h4, h5, h6, strong, th, var{ font-weight:normal; font-style:normal; } ul { list-style:none; } caption, th{ text-align:left; } h1, h2, h3, h4, h5, h6{ font-size:1.0em; } q:before, q:after{ content:''; } a, ins{ text-decoration:none; }
Yahoo CSS Reset
The reset written by Yahoo is recommended for the following scenarios: body, Div, DL, DT, DD, UL, ol, Li, H1, H2, H3, H4, H5, H6, pre, form, fieldset, input, textarea, P, BLOCKQUOTE, Th, TD {padding: 0; margin: 0 ;}table {border-collapse: collapse; border-Spacing: 0 ;} fieldset, IMG {border: 0;} address, caption, cite, code, dfn, em, strong, Th, VAR {font-weight: normal; font-style: normal ;} OL, UL {list-style: none;} caption, Th {text-align: Left;} H1, H2, H3, H4, H5, H6 {font-weight: normal; font-size: 100%;} Q: before, Q: After {content: '';} abbr, acronym {border: 0 ;}
Erik Meyer's CSS Reset
The author reorganized the Erik Meyer code, but the function is still the same.
This CSS reset is the most widely used in the industry.
HTML, body, Div, span, applet, object, IFRAME, table, caption, tbody, tfoot, thead, TR, Th, TD, Del, dfn, em, Font, IMG, INS, KBD, Q, S, SAMP, small, strike, strong, sub, sup, TT, VAR, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, PRE, A, abbr, acronym, address, big, cite, code, DL, DT, DD, ol, UL, Li, fieldset, form, label, legend {vertical-align: baselinebaseline; font-family: Inherit; font-weight: Inherit; font-style: Inherit; font-size: 100%; outline: 0; padding: 0; margin: 0; Border: 0 ;}: focus {outline: 0 ;}body {Background: white; line-Height: 1; color: Black ;}ol, UL {list-style: none ;} table {border-collapse: Separate; border-Spacing: 0;} caption, Th, TD {font-weight: normal; text-align: Left;} BLOCKQUOTE: before, BLOCKQUOTE: after, Q: before, Q: After {content: "";} BLOCKQUOTE, q {quotes :"""";} in general, condensed Meyer reset modifies and improves the CSS reset of Erik Meyer. body, Div, DL, DT, DD, UL, ol, Li, H1, H2, H3, H4, H5, H6, pre, form, fieldset, input, textarea, P, BLOCKQUOTE, Th, TD {padding: 0; margin: 0;} fieldset, IMG {border: 0;} table {border-collapse: collapse; border-Spacing: 0 ;} OL, UL {list-style: none;} address, caption, cite, code, dfn, em, strong, Th, VAR {font-weight: normal; font-style: normal;} caption, Th {text-align: Left;} H1, H2, H3, H4, H5, H6 {font-weight: normal; font-size: 100% ;} q: before, Q: After {content: '';} abbr, acronym {border: 0 ;}