CSS初始化

最新推荐文章于 2024-08-04 22:25:38 发布

FG.

最新推荐文章于 2024-08-04 22:25:38 发布

阅读量261

点赞数 2

分类专栏： CSS3 文章标签： css css3 html

本文链接：https://blog.csdn.net/weixin_54418006/article/details/122428538

版权

CSS3 专栏收录该内容

35 篇文章 1 订阅

订阅专栏

不同浏览器对有些标签的默认值是不同的，为了消除不同浏览器对HTML文本呈现的差异，照顾浏览器的兼容，所以需要对CSS初始化。
每个网页都必须首先进行初始化。
以京东CSS初始化为例：

/*把我们所有标签的内外边距清零*/
* { 
    margin:0;
    padding:0;
}
/*把em,i 斜体文字不倾斜*/
em,
i { 
    font-style:normal;
}
/*去掉li的小圆点*/
li { 
    list-style:none;
}

img {
    /*border: 0 照顾低版本浏览器 如果图片外面包含了链接会有边框的问题*/
    border:0;
    /*取消图片底侧有空白缝隙问题*/
    vertical-align:middle;
}
/*当我们鼠标经过button按钮的时候，鼠标变成小手*/
button {
    cursor:pointer;
}

a {
    color:#666;
    text-decoration:none;
}

a:hover {
    color:#c81623;
}

button,
input { 
    font-family:Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB,"\5B8B\4F53", sans-serif;
}

body {
    /*CSS3抗锯齿性 让文字显示的更加清晰*/
    -webkit-font-smoothing:antialiased;
    background-color:#fff;
    font:12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB,"\5B8B\4F53", sans-serif;
    color:#666;
}

.hide,
.none {
    display:none;
}
/*清除浮动*/
.clearfix:after {
    visibility:hidden;
    clear:both;
    display:block;
    content:".";
    height:0;
}

.clearfix {
    *zoom:1;
}

Unicode编码字体
把中文字体的名称用相应的Unicode编码来代替，这样就可以有效的避免浏览器解释CSS代码时候出现乱码的问题。
比如：
黑体　\9ED1\4F53
宋体　\5B8B\4F53
微软雅黑　\5FAE\8F6F\96C5\9ED1