HTML CSS 去除默认样式表，直接复制创建css文件，导入到html文件中即可使用

我们写网页的时候，一般都会清除默认样式，下面是我一直在使用的清除默认样式的css文件，是之前在拷贝了本平台某老兄的，忘了是谁的了。我觉得很好用，也很有用，就分享（转载）一下。大家可以直接翻到后半段复制汇总部分的就好。（因为找不到原文了，所以没有原文链接，无法发布转载，只好发布原创。如果那位老兄觉得不合适，可以联系我删文哦！）

为什么要去除默认样式？

为了保证在没有定义一些样式的情况下，渲染有能有迹可循，所以各大浏览器都会加入自己的默认样式，不同的浏览器厂家的默认样式不一样。这些默认样式会影响我们的网页设计，最怕的就是同一个网页在不同浏览器上显示效果不一样。所以我们要清除这些默认样式。

去除默认样式

全局去除默认样式

/*全局去除默认样式*/ 
*{
	padding:0;
	margin:0;
	box-sizing: border-box;
	font-size: 14px;
}

a标签去除默认样式

/*a标签去除默认样式*/
 a{
 	text-decoration: none;
 	color:#333;
}
// 设置使所有a标签的四种状态都和本身颜色保持一致，样式代码自己写
 a:hover, a:visited, a:link, a:active {
    color:#333;
}

去除li样式

/*li*/
ul,ol{
	list-style: none;
}

去除img样式

/*img*/
img{
　　vertical-align：top；
　　border：none;
}

去除button样式

/*button*/
.button{
    border:0;
    background-color:none
    outline:none;
    -webkit-appearance: none;//用于IOS下移除原生样式
}

去除select样式

/*select*/
select {
    border: none;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    /*在选择框的最右侧中间显示小箭头图片*/
    background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;
    padding-right: 14px;
}

去除h1样式

/*h1*/
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
}

去除input，textarea样式

/*input，textarea*/
input,textarea {
    outline: none;
    border: none;
}
textarea {
    resize: none;
    overflow: auto;
}

去除斜体 i样式

/*斜体 i*/
i{
	font-style: normal;
}

去除table样式

/*table*/
table{
	border-collapse:collapse;
	border-spacing:0;
}

去除input[type=number]加减号

/*去除input[type=number]加减号*/
/* 谷歌 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}
/* 火狐 */
input{
    -moz-appearance:textfield;
}

汇总，方便大家复制

/*全局去除默认样式*/ 
*{
	padding:0;
	margin:0;
	box-sizing: border-box;
	font-size: 14px;
}

/*a标签去除默认样式*/
 a{
 	text-decoration: none;
 	color:#333;
}
// 设置使所有a标签的四种状态都和本身颜色保持一致
 a:hover, a:visited, a:link, a:active {
    color:#333;
}

/*li*/
ul,ol{
	list-style: none;
}

/*img*/
img{
　　vertical-align：top；
　　border：none;
}

/*button*/
.button{
    border:0;
    background-color:none
    outline:none;
    -webkit-appearance: none;//用于IOS下移除原生样式
}

/*select*/
select {
    border: none;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    /*在选择框的最右侧中间显示小箭头图片*/
    background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;
    padding-right: 14px;
}

/*h1*/
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
}

/*input，textarea*/
input,textarea {
    outline: none;
    border: none;
}
textarea {
    resize: none;
    overflow: auto;
}

/*斜体 i*/
i{
	font-style: normal;
}

/*table*/
table{
	border-collapse:collapse;
	border-spacing:0;
}

/*去除input[type=number]加减号*/
/* 谷歌 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}
/* 火狐 */
input{
    -moz-appearance:textfield;
}

导入去除默认样式.css到html文件中使用

<!--引入重置样式表-->
<link rel="stylesheet" href="../css/去除默认样式.css" />

使用的时候改一下href的值就好。