页面的css初始化

smilewgchao

于 2016-09-07 15:28:34 发布

阅读量372

点赞数

CC 4.0 BY-SA版权

分类专栏： web前端文章标签： css初始化

本文链接：https://blog.youkuaiyun.com/smilewgchao/article/details/52460043

web前端专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了CSS初始化的目的及方法，包括清除标签默认样式如margin、padding等，并提供了实用的clearfix类来解决浮动元素的问题。

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

一 css初始化主要针对两种情况：

清除标签自带样式。例如以下几个例子

/* 初始化body的margin和padding */
body{margin:0;padding:0;}
/* li和a标签的自带样式 */
li{list-decoration:none;}
a{text-decoration:none;}

可以被html多个标签重复使用的类，例如

/* 清除浮动用到的类.clearfix */
.clearfix:after{content:"";display:block;clear:both;}
.clearfix{zoom:1;}

二 css初始化的一个demo：

@charset "utf-8"
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6.form,fieldset,table,td,img,div,dl,dt,dd,input{margin:0;padding:0;}
body{font-size:12px;}
img{border:none;}
li{list-style:none;}
input,select,textarea{outline:none;}
textarea{resize:none;}
a{text-decoration:none;}
/* 清除浮动 */
.clearfix:after{content:"";display:block;clear:both;}
.clearfix{zoom:1;}