css之reset

Jancy1072

于 2017-03-09 17:02:22 发布

阅读量386

点赞数 1

CC 4.0 BY-SA版权

分类专栏： css 文章标签： css

本文链接：https://blog.youkuaiyun.com/shelly1072/article/details/60963312

css 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一种精简版的CSS Reset方法，建议开发者根据实际需求裁剪和修改reset样式，去除不必要的元素以减少代码量并提高渲染性能。文中提供了一个具体的精简reset样式示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

不要使用

不要使用* { margin: 0; padding: 0; }
不要完全照搬网上下载来的reset.css。

要根据具体需求，适量裁剪和修改后再使用。没用到的元素可以直接拿掉，减少代码量，避免影响渲染性能。

我的版本

body, h1, h2, h3, h4, h5, h6, hr, p, 
dl, dt, dd, ul, ol, li,
pre, 
fieldset, lengend, button, input, textarea, 
th, td { 
    margin: 0;
    padding: 0;
}
:focus {
    outline: 1;
}
h1,h2,h3,h4, h5, h6 { font-size: 100%; }
small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */
ul, ol { list-style: none; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
legend { color: #000; } /* for ie6 */
fieldset, img { border: none; } /* 让链接里的 img 无边框 */
button, input, select, textarea {
    font-size: 100%; /* 使得表单元素在 ie 下能继承字体大小 */
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
hr {
    border: none;
    height: 1px;
}
.clearfix:after{
    content: '';
    display: table;
    clear:both;
}
.clearfix{
    *zoom:1;//激发hasLayout,兼容IE6/7
}