北京WEB前端培训
在线咨询 电话咨询 校区地址

课程

环境

就业

试听

企业培训

扫码
关注

首页 / 

行业资讯

北京web前端培训 css的reset

时间: 来源:火星人

什么是reset

HTML标签在浏览器中都有默认的样式,例如p标签有上下边距,strong标签有字体加粗样式等。不同浏览器的默认样式之间存在差别,例如ul默认带有缩进样式,在IE下,它的缩进是由margin实现的,而在Firefox下却是由padding实现的。开发时浏览器的默认样式可能会给我们带来多浏览器兼容性问题,影响开发效率。现在很流行的解决方法是一开始就将浏览器的默认样式全部覆盖掉,这就是CSS reset。

大体上就是通过引入一个css样式表来重置html基本央视,使其变成一张“白纸”,在绝大多数浏览器上都能以一致的效果呈现网页。
具体代码是:
html, body, div, span,applet, object, iframe, table, caption,
tbody, tfoot, thead, tr,th, td, del, dfn, em, font, img, ins,
kbd, q, s, samp, small,strike, strong, sub, sup, tt, var,
h1, h2, h3, h4, h5, h6,p, blockquote, pre, a, abbr,
acronym, address, big,cite, code, dl, dt, dd, ol, ul, li,
fieldset, form, label,legend {
  vertical-align: baselinebaseline;
  font-family: inherit;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  outline: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

:focus {
  outline: 0;
}

body {
  background: white;
  line-height: 1;
  color: black;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}


大体上就是这样了,根据个人和企业还可以做自己的修改 但是这种方法太过暴力,而且会造成一些浪费,比如div元素本来就没有margin,但是这个reset还是做了margin的清零,这样不必要的设置就会造成浏览器资源不必要的消耗。积少成多,网页加载的速度就慢下来了。而且有些激进的reset会重置html语义化标签,这对html语义化是非常不利的。

正因为如此,就诞生了Normalize.css

Normalize.css相对与reset.css相对“温柔”,“细致”。他会细致的按需要重置需要重置的标签,不会导致资源浪费。也不会暴力重置所有的标签,为html语义化保留了余地。
而且它修复了常见的桌面端和移动端浏览器的bug。这往往超出了Reset所能做到的范畴
在百度上搜索Normalize.css就可以找到它的官网,他有完善的帮助文档,具体做了何种改动上面都有记录

关键词:北京web前端培训,北京web培训,web前端培训

热门课程推荐  点击查看全部课程

北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
北京UI培训
  • 14年教育品牌
  • 课程不断更新
  • 签订就业协议
  • 项目案例讲解
  • O2O教学模式

北京火星人科技文化发展中心版权所有 Copyright & copy 2002-2016 2ds.cn, All Rights Reserved 京ICP备 10216795号