CSS style initialization

Method One:CSS reset

/* Reset */html{color: #000; background: #fff;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;} BODY{FONT:12PX/1 tahoma,helvetica,arial, "\5b8b\4f53", Sans-serif;} Img{border:none;} Em,strong{font-style:normal;font-weight:normal;} Li{list-style:none;} Table {border-collapse:collapse;border-spacing:0;} h1{font-size:18px;} h2{font-size:16px;} h3{font-size:14px;} H4, H5, h6{font-size:100%;} Q:before,q:after{content: ';} /* Eliminate Q before and after content */button,input,select,textarea{font-size:100%;} /* Causes the form element to inherit the font size */input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit under IE; Font-style:inherit;font-weight:inherit;} Address,cite,dfn,em,var{font-style:normal,}/* will be italic *//* link */a{color: #36c; text-decoration:none;} A:hover{color: #f60; text-decoration:underline;}

Method Two: Normalize.css

/*! normalize.css v4.1.1 | mit license | github.com/necolas/normalize.css  *//** * 1. Change the default font family in all  browsers  (opinionated) . * 2. prevent adjustments of font size  after orientation changes in ie and ios. */html {   font-family: sans-serif; /* 1 */  -ms-text-size-adjust: 100%; /*  2 */  -webkit-text-size-adjust: 100%; /* 2 */}/** * remove  the margin in all browsers  (opinionated) . */body {  margin:  0;} /* html5 display definitions   ================================================= ========================= *//** * add the correct display in ie 9 -. * 1. add&Nbsp;the correct display in edge, ie, and firefox. * 2. add  the correct display in ie. */article,aside,details, /* 1 */ Figcaption,figure,footer,header,main, /* 2 */menu,nav,section,summary { /* 1  */  display: block;} /** * add the correct display in ie 9-. */audio,canvas,progress, Video {  display: inline-block;} /** * add the correct display in ios 4-7. */audio:not ([controls])  {  display: none;  height: 0;} /** * add the correct vertical alignment in chrome, firefox,  and opera. */progress {  vertical-align: baseline;} /** * add the correct display in ie 10-. * 1. add the correct display in ie. */template, /* 1 */[hidden] {   display: none;} /* links   ==========================================================================  *//** * 1. Remove the gray background on active links  In ie 10. * 2. remove gaps in links underline in ios  8+ and safari 8+. */a {  background-color: transparent; /*  1 */  -webkit-text-decoration-skip: objects; /* 2 */}/** *  remove the outline on focused links when they are also  active or hovered * in all browsers  (opinionated).  */a:active,a:hover  {  outline-width: 0;} /* text-level semantics   ========================================================================== *//** * 1. remove the  Bottom border in firefox 39-. * 2. add the correct text  decoration in chrome, edge, ie, opera, and safari. */abbr[title]  {  border-bottom: none; /* 1 */  text-decoration: underline ;  /* 2 */  text-decoration: underline dotted; /* 2 */}/**  * Prevent the duplicate application of  ' Bolder '  by the next  rule in safari 6. */b,strong {  font-weight: inherit;} /** * add the correct font weight in chrome, edge, and  Safari. */b,strong {  font-weight: bolder;} /** * add the correct font style in&nBsp Android 4.3-. */dfn {  font-style: italic;} /** * correct the font size and margin on  ' H1 '  elements  within  ' section '  and *  ' article '  contexts in chrome, firefox,  and safari. */h1 {  font-size: 2em;  margin: 0.67em 0;} /** * add the correct background and color in ie 9-. */ mark {  background-color:  #ff0;  color:  #000;} /** * add the correct font size in all browsers. */small  {  font-size: 80%;} /** * prevent  ' Sub '  and  ' sup '  elements from affecting the  line height in * all browsers. */sub,sup {  font-size: 75%;   line-height: 0;  poSition: relative;  vertical-align: baseline;} Sub {  bottom: -0.25em;} Sup {  top: -0.5em;} /* embedded content   =============================================================== =========== *//** * remove the border on images inside links  in ie 10-. */img {  border-style: none;} /** * hide the overflow in ie. */svg:not (: root)  {  overflow:  hidden;} /* grouping content   =============================================================== =========== *//** * 1. correct the inheritance and scaling of  font size in all browsers. * 2. Correct the odd  ' em '  font sizing in all browsers. */code,kbd,pre,samp {  font-famiLy: monospace, monospace; /* 1 */  font-size: 1em; /* 2  */}/** * add the correct margin in ie 8. */figure {   margin: 1em 40px;} /** * 1. add the correct box sizing in firefox. * 2.  show the overflow in edge and ie. */hr {  box-sizing:  content-box; /* 1 */  height: 0; /* 1 */   overflow: visible; /* 2 */}/* forms   ================================ ========================================== *//** * 1. change font properties  to  ' Inherit '  in all browsers  (opinionated).  * 2. remove the  margin in firefox and safari. */button,input,select,textarea {   font: inherit; /* 1 */  margin: 0; /* 2 */}/** *  restore the font weight unset by the previous rule. */ Optgroup {  font-weight: bold;} /** * show the overflow in ie. * 1. show the overflow  in edge. */button,input { /* 1 */  overflow: visible;} /** * remove the inheritance of text transform in edge,  firefox, and ie. * 1. remove the inheritance of text  Transform in firefox. */button,select { /* 1 */  text-transform:  none;} /** * 1. prevent a webkit bug where  (2)  destroys native   ' Audio '  and  ' video '  *    controls in&nbsP android 4. * 2. correct the inability to style clickable  Types in ios and safari. */button,html [type= "button"], /* 1 */[ Type= "Reset"],[type= "Submit"] {  -webkit-appearance: button; /* 2 */}/**  * remove the inner border and padding in firefox. */button: :-moz-focus-inner,[type= "button"]::-moz-focus-inner,[type= "reset"]::-moz-focus-inner,[type= "Submit"]::- moz-focus-inner {  border-style: none;  padding: 0;} /** * restore the focus styles unset by the previous rule.  */button:-moz-focusring,[type= "button"]:-moz-focusring,[type= "reset"]:-moz-focusring,[type= "Submit"]:- Moz-focusring {  outline: 1px dotted buttontext;} /** * change the border, margin, and padding in all browsers  (opinionated) . */fieldset {  border: 1px  solid  #c0c0c0;  margin: 0 2px;  padding: 0.35em 0.625em  0.75em;} /** * 1. correct the text wrapping in edge and ie. *  2. Correct the color inheritance from  ' FieldSet '  elements in  IE. * 3. Remove the padding so developers are not  caught out when they zero out *     ' FieldSet '  elements  in all browsers. */legend {  box-sizing: border-box; /* 1  */  color: inherit; /* 2 */  display: table; /* 1  */  max-width: 100%; /* 1 */  padding: 0; /* 3  */  white-space: normal; /* 1 */}/** * remove the default vertical  Scrollbar in ie. */textarea {  overflow: auto;} /** * 1. add the correct box sizing in ie 10-. *  2. remove the padding in ie 10-. */[type= "checkbox"],[type= "Radio"] {   box-sizing: border-box; /* 1 */  padding: 0; /* 2  */}/** * Correct the cursor style of increment and  Decrement buttons in chrome. */[type= "number"]::-webkit-inner-spin-button,[type= "number"]: :-webkit-outer-spin-button {  height: auto;} /** * 1. correct the odd appearance in chrome and safari.  * 2. correct the outline style in safari. */[type= "Search"] {  -webkit-appearance: textfield; /* 1 */  outline-offset:  -2px; /* 2 */}/** * Remove the inner padding and  Cancel buttons in chrome and safari on os x. */[type= "Search"]::- Webkit-search-cancel-button,[type= "Search"]::-webkit-search-decoration {  -webkit-appearance:  none;} /** * correct the text style of placeholders in chrome, edge , and safari. */::-webkit-input-placeholder {  color: inherit;   opacity: 0.54;} /** * 1. correct the inability to style clickable types in  iOS and Safari. * 2. Change font properties to  ' Inherit '  in safari. */::-webkit-file-upload-button {  -webkit-appearance: button; /* 1 */  font: inherit; /* 2 */} 

CSS style initialization