很多html都会有默认属性,而且对不同浏览默认值可能不同,很容易导致兼容性问题。而且对于默认值,也容易被自己或他人忽略而造成样式没有达到预期效果。
比如body在浏览器中会有默认的margin如果不清除,对于我们后面的代码编写会造成影响,明明没有写的属性却被设置了。对于其他如p元素、input元素等亦是如此。
@charset "utf-8"body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,code,form,fieldset,legend,button,input,textarea{padding:0pxmargin:0pxborder:none}
a,a:visited{text-decoration:none}
a:active,a:hover{text-decoration:none}
a:focus,input:hover,button:hover,input[type='button']:hover{outline:none}
:focus{outline:0}
i,cite{font-style: normal}
b, strong { font-weight: bold }
h1,h2,h3,h4,h5,h6{font-weight: normal}
li{vertical-align:bottomlist-style-type:none}
input[type=checkbox],input[type=email],input[type=number],input[type=password],input[type=radio],input[type=search],input[type=tel],input[type=text]{vertical-align:middleoutline:0-webkit-appearance:none-webkit-user-select:text}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#999}
select,textarea{outline:0-webkit-appearance:none}
textarea{-webkit-user-select:text}
table{border-collapse:collapseborder-spacing:0}
*{-webkit-user-select:none-webkit-tap-highlight-color:rgba(0,0,0,0)-webkit-touch-callout:none}
body, button, input, select, textarea{outline:none}
button, input, optgroup, select, textarea { color: inheritfont: inheritmargin: 0 }
input,select,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0)-webkit-appearance:noneborder:0border-radius:0}
button { overflow: visible }
button, select { text-transform: none }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: buttoncursor: pointer }
button[disabled], html input[disabled] { cursor: default }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0padding: 0 }
input { line-height: normal }
input[type="checkbox"], input[type="radio"] { box-sizing: border-boxpadding: 0 }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto }
input[type="search"] { -webkit-appearance: textfield-moz-box-sizing: content-box-webkit-box-sizing: content-boxbox-sizing: content-box }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none }
table { border-collapse: collapseborder-spacing: 0 }
td, th { padding: 0 }
/* 禁止webkit横屏改变字体大小*/
html{-webkit-text-size-adjust:100%-ms-text-size-adjust:100%}
/* 设置HTML5元素为块*/
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:blockpadding:0pxmargin:0pxborder:none}
/* 超出隐藏*/
.overflow{overflow:hidden}
/* 点击去除阴影*/
a,button,input,i{-webkit-tap-highlight-color:rgba(0,0,0,0)-moz-tap-highlight-color:rgba(0,0,0,0)-ms-tap-highlight-color:rgba(0,0,0,0)tap-highlight-color:rgba(0,0,0,0)}
/* float*/
.fl{float: left}
.fr{float: right}
/* 图片自适应调整 并解决图片缩放的失真问题*/img{max-width:100%height:autoborder:noneinterpolation-mode: bicubic}
/* 文字居中*/
.txt-center{text-align:center}
.txt-justify{text-align:justifytext-justify:inter-ideograph}
/* 自动换行*/
.word-auto{word-wrap: break-wordword-break: normal}
/* 自动居中*/
.word-hidden{text-overflow: ellipsiswhite-space: nowrapoverflow: hidden}
.mg-auto{margin-left:automargin-right:autoposition:relative}
/* clearfix*/
.clearfix:after{visibility: hiddendisplay: blockfont-size: 0content:" "clear: bothheight: 0}
.clearfix{*zoom:1}
.middle{vertical-align: middle}
body{-webkit-text-size-adjust:none-webkit-tap-highlight-color:rgba(0,0,0,0)-webkit-font-smoothing:antialiased-moz-user-select:noneoverflow-x:hidden -webkit-user-select: none}