预习（一） CSS Reset

什么是CSS Reset？

简单的说，就是当我们在制作页面的时候，浏览器会给html标签，默认加上样式，比如：<table>的<th>标签，浏览器默认会给这个标签加粗（浏览器默认样式都是以标签的形式添加的），甚至不同的浏览器，默认的样式还略微有差异，而这些默认的样式在我们实际开发中根本不需要，因此，我们就需要讲样式重制。

如何做CSS Reset?

既然浏览器是通过标签的形式给其附加样式，那么我们也通过标签的形式将浏览器的默认样式覆盖掉就可以了。

其实，做CSS Reset在项目的初期，将设计中默认的，具有共性的样式，提取出来，单独做成reset样式问，这样在中后期实际开发的过程中，就可以大量的减少基础样式的开发；

下面附上一份平时用的CSS Reset样式文件：

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td {
    margin:0; padding:0;
}
body {
    background:#fff;
    color:#555;
    font-size:14px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}
td,
th,
caption {
    font-size:14px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight:normal;
    font-size:100%;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
    font-style:normal;
    font-weight:normal;
}
a {
    color:#555;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
img {
    border:none;
}
ol,ul,li {
    list-style:none;
}
input,
textarea,
select,
button {
    font:14px Verdana,Helvetica,Arial,sans-serif;
}
table {
    border-collapse:collapse;
}
html {
    overflow-y: scroll;
}
.clearfix:after {
    content: "";
    display: block;
    height:0;
    clear:both;
    visibility: hidden;
}
.clearfix {
    *zoom:1;
}

预习（一） CSS Reset

猜你喜欢