CSS 重置元素样式示例 reset.css

仅供学习，转载请注明出处

简介

在写html的过程中，经常需要去取消不少元素的默认样式，例如：ul去除前面的小圆点、body的margin以及padding取消等等。

为了方便，可以专门设置一个样式文件，统一编写好，然后引入即可。

重置元素样式 reset.css

示例代码如下：

/* 将标签默认的间距设为0   */
body,ul,p,h1,h2,h3,h4,h5,h6,dl,dd,input,select,form{
    margin:0;padding:0;
}

/* 让h标签继承body内设置的字体大小 */

h1,h2,h3,h4,h5,h6{
    font-size:100%;
}


/* 去掉默认的项目图标 */
ul{
    list-style:none;
}


em{
    font-style:normal;
}

a{
    text-decoration:none;
}

/* 去掉IE下，图片做链接时候产生的边框 */
img{
    border:none;
}


/* 清除margin-top塌陷和清除浮动 */
.clearfix:before,.clearfix:after{
    content: "";
    display:table;
}

.clearfix:after{
    clear:both;
}

.clearfix{
    zoom:1;
}


.fl{
    float:left;
}

.fr{
    float:right;
}

还有更多需要统一清除的样式可以继续写入，上方的内容只是提供示例而已。

注意：引入样式文件的顺序应该放在第一位，不然就会被其他样式文件所覆盖。

css引入示例如下：

<link rel="stylesheet" href="./css/reset.css">

微信公众号