css reset重置样式有那么重要吗?
在以前写html代码的时候,一般都会在head里添加重置样式reset.css,其内容如下:
@charset "utf-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:;
padding:;
border:;
outline:;
font-size: 100%;
/*background: transparent;*/
}
table {
border-collapse:collapse;
border-spacing:;
}
fieldset, img { border:;}
address, caption, cite, code, dfn, em, strong, th, var {
font-style:normal;
font-weight:normal;
}
ol, ul { list-style:none; }
caption, th { text-align:left; }
h1, h2, h3, h4, h5, h6 {
font-size:200%;
font-weight:normal;
}
:focus { outline:;}
a{ text-decoration:none;}
a:hover img{ border:none;} a:active{noOutline:expression(this.onFocus=this.blur());}
/*清除浮动*/
.clearfix:after {
content: ".";
display: block;
height:;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */ /*png css hack for ie6*/
*html img.png{
_background-image: expression(this.runtimeStyle.backgroundImage = "none",this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",this.src = "http://i0.itc.cn/20101019/848_0a785a7b_1118_4825_85dc_e8696988c94b_0.gif");
}
但是最近在网上看了看网络文章,也感觉有些重置是没有用的。为什么呢?
重置的作用究竟是什么?
CSS reset的作用是让各个浏览器的CSS样式有一个统一的基准,而这个基准更多的就是“清零”!
有时候看到别人网站站的一些重置是这样的:
*{ margin:; padding:; }
这样的写法是极不推荐的。
现在来看重置表发现:
1. div标签默认有margin值吗?有padding值吗?怎么会想到应用div{margin:0; padding:0;}属性呢?答案肯定没有。
2. dt标签有默认的margin与padding值就是0,什么还要使用呢?
3. li标签默认有margin值吗?有padding值吗?没有!
4. code标签是个属于inline水平的元素,居然也扯到margin与padding的重置,没有必要。
5. fieldset, legend这两个90年代的标签你的网站上使用了吗?使用概率不足1%的标签也拿来重置,也没必要。
css真的重置也就那么几个常用的标签而已,你的页面一般都用到什么标签?
body, dl, dd, h1, h2, h3, h4, h5, h6, p, form{margin:;}
ol,ul{margin:; padding:;}
这样的CSS reset才是高效的,简洁的,其他一些标签都可以去掉的,没有必要。
当然css重置的优点,缺点都不说了,估计心里都非常有数的,还是要根据实际项目来。
后来主管给我推荐了一款替代reset.css重置的替代方案,那就是用Normalize.css。在后面文章里把它的用法等再列出来。
css reset重置样式有那么重要吗?的更多相关文章
- CSS RESET —— 浏览器样式重置
CSS Reset 1. CSS Reset为什么存在? 只要您的客户存在使用不同浏览器(ie,firefox,chrome等)的可能,那你就不得不从完美的理想状态回到现实,因为不同核心的浏览器对CS ...
- CSS Reset(样式重置)
CSS Reset,意为重置默认样式.HTML中绝大部分标签元素在网页显示中都有一个默认属性值,通常为了避免重复定义元素样式,需要进行重置默认样式(CSS Reset).举几个例子:1.淘宝(CSS ...
- css网页重置样式表(多版本)
Eric reset.css html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, ...
- css reset初始化样式
原文:https://www.cnblogs.com/caojiayan/p/6343917.html /* CSS Document */ html, body, div, span, object ...
- css reset的重置作用(可取还是不可取,取决于你)
一.重置的理由 当今流行的浏览器中,有些都是以自己的方式去理解css规范,这就会到只有的浏览器对css的解释与设计师的css定义初衷相冲突,使得网页的样子在某些浏览器下能正确按照设计师的想法显示.,但 ...
- 重置浏览器的默认样式(css reset)
(1)定义:首先css reset指的是重置浏览器的默认样式 (2)作用:因为现在的浏览器很多,并且每个浏览器都有自己的默认样式,这样就会导致一个页面在多个浏览器下展示产生差异,所以我们需要做一些处理 ...
- 重置默认样式 css reset
html { overflow-x:auto; overflow-y:scroll; } body, dl, dt, dd, ul, ol, li, pre, form, fieldset, inpu ...
- CSS Reset样式重置
为了让页面在各不同浏览器之间显示效果一致,CSS样式清除和重置是前端开发必需要做的事情,结合前车之鉴,整理了份CSS重置样式代码供参考. @charset "utf-8"; /* ...
- CSS Reset / Normalize 如何进行样式重置
CSS Reset 过于激进,所有样式全部消除没有必要. 关键是保持各种浏览器的兼容,包括Bootstrap的CSS Reset也是走的这个路线. 线面这个就是后面一种思路的成果: http://ne ...
随机推荐
- 【Effective Java】3、避免创建不必要的对象
创建对象的时候,有些变量可以一直保持的时候,可以不必要每次实例化对象的时候都把这些变量初始化一遍,可以使用静态和静态块的方式把这些变量的数据固定下来 package cn.xf.cp.ch02.ite ...
- Play常用代码片段 http://www.anool.net/?p=625
持续更新中: (1)按照降序查询: List<Entity> entities= Entity.find("order by id desc").fetch(2); ...
- 自制javascript游戏-点燃火绳
自制javascript游戏-点燃火绳 这是一款多关卡的游戏,目录有21个地图,游戏采纯原生 js库JY编写,所以编写得很简单迅速,这款游戏的思路来源于,一个人撸管太多,手会不会连鼠标也拿不稳,为了验 ...
- 用构造函数创建对象时的this的指向问题
用构造函数方式创建对象: function Person(name,age){ this.name=name; this.age=age; this.sayname=function(){ alert ...
- gulp入坑系列(3)——创建多个gulp.task
继续gulp的爬坑路,在准备get更多gulp的具体操作之前,先来明确一下在gulp中创建和使用多个task任务的情况. gulp所要做的操作都写在gulp.task()中,系统有一个默认的defau ...
- 解决虚拟机linux端mysql数据库无法远程访问
解决虚拟机linux端mysql数据库无法远程访问 1. 在控制台执行 mysql -u root -p mysql,CentOS系统提示输入数据库root用户的密码,输入完成后即进入mysql控制台 ...
- 使用greenDAO生成DAO代码
研究greenDAO有几天了,刚开始看别人的博客基本都把我带到了沟里,讲gradle把简单的问题搞得非常复杂,而且都是抄来抄去,看来看去也就那么几篇,实在看不下去了,只得硬着头皮自己琢磨,好在终于把这 ...
- iOS之通过PaintCode快速实现交互动画的最方便方法 未解问题
需求: 问题: 源码百度云下载链接: http://pan.baidu.com/s/1o7r4hCm 密码: 8atd 其他学习链接:http://www.jianshu.com/p/90d6cd35 ...
- java获取时间戳的方法
JAVA 获取当前月的初始时间的时间戳 public static long getMonthFirstDay() { Calendar calendar = Calendar.getInstance ...
- android 进程间通信数据(二)------parcel的实现
Serialize是java原生就自带的东西,我们可以看到android的源码 所以看看android是如何实现parcel的,这对我们自己代码设计有什么启发. Parcel: 在android中,p ...