[笔记]为什么使用reset.css

    选择打赏方式

微信公众号伊伊兔Yi-Yi-Tu,QQ群号:455535550,淘宝天猫优惠劵领取网站:dy208.cn

大家都知道html标签在各浏览器的默认样式解析出来是有所不同的,就像<ul>标签在IE、firefox、chrome浏览器下默认边距是不一样的。

为防止不同浏览器默认样式对于网页布局样式造成的影响,我们会在HTML文件的头部引入这段css重置浏览器样式,

将一些浏览器所不同的样式以及部分标签的默认样式清除掉.

先看reset.css代码:

 /* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
capation,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before, q:after{content:''}
abbr,acronym{border:0;}

body{font-size:14px; color:#333; font-family:"微软雅黑"; -webkit-tap-highlight-color:rgba(0,0,0,0);}
body a{color:#333; text-decoration:none;}
body p{line-height: 1.8em;}
header,main{display: block;}
/* 文字排版 */ 
.f12{font-size:12px;}
.f13{font-size:13px;}
.f14{font-size:14px;}
.f16{font-size:16px;}
.f20{font-size:20px;}
.fb{font-weight:bold;}
.fn{font-weight:normal;}
.t2{text-indent:2em;}
.lh150{line-height:150%}
.lh180{line-height:180%}
.lh200{line-height:200%}
.unl{text-decoration:underline;}
.no_unl{text-decoration:none;}

/* 定位 */
.tl{text-align:left;}
.tc{text-align:center;}
.tr{text-align:right;}
.bc{margin-left:auto;margin-right:auto;}
.fl{float:left;display:inline;}  /* 可修复IE6中双倍边距bug */
.fr{float:right;display:inline;}
.cb{clear:both;}
.cl{clear:left;}
.cr{clear:right;}
.clearfix:after{content:'';display:block;height:0;clear:both;visibility:hidden}
.clearfix{display:inline-block;}
* html .clearfix{height:1%}
.clearfix{display:block;}
.pr{position:relative;}
.pa{position:absolute;}
.abs-right{position:absolute;right:0;}
.zoom{zoom:1}
.hidden{visibility:hidden;}
.none{display:none;}
a:focus,select:focus,input:focus,textarea:focus{outline:none; -moz-outline:none; -webkit-outline:none;}
.bdbox{max-width:640px; margin:0 auto;}


记得你才接触开发的时候吗,在写页面时都会先写上

*{
    padding: 0;
    margin: 0;
}


来清楚浏览器默认边距,reset.css是一样的道理,

你可以DIY一套自己的reset.css,加上自己常用的属性,

上面的.clearfix就是我惯用的清楚浮动的方式和类名,

今天开始搬运我的有道云笔记了,加油吧各位。

版权声明:若无特殊注明,本文皆为《 子成君 》原创,转载请保留文章出处。
本文链接:[笔记]为什么使用reset.css https://www.zcjun.com/learn/409.html
百度收录:本文已提交百度暂未被收录!
本文到此结束

热门推荐

发表吐槽

你肿么看?

你还可以输入 250 / 250 个字

爱你允悲悲伤吃惊委屈可怜憧憬吃瓜大哭开心坏笑笑哭哼打哈欠鼓掌乖嘘阴险日了狗费解挤眼滑稽666比心


既然没有吐槽,那就赶紧抢沙发吧!