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 ...
随机推荐
- 强大的修改数据库修改语句ALTER TABLE(一)[20160712]
今天开始的时间比昨天晚,其实午休的时间是差不多的,只是起来后稍微看了一点新闻,10分钟时间就没有了,所以要养成一个好习惯还真不容易,另外就是工作时间少看新闻,太浪费时间. 昨天在执行一个alter S ...
- JMS学习(一)基本概念
这两天面试了一两个公司,由于简历中的最近一个项目用到了JMS,然而面试官似乎对这个很感兴趣,所以都被问到了,但可惜的是,我除了说我们使用了JMS外,面对他们提出的一些关于JMS的问题,我回答得相当差, ...
- jquery checkbox checked
1.question: when first operate the checkbox with sentence like : $("input[type=checkbox]") ...
- python3学习笔记目录
目录: Python基础(一),Day1 python基础(二),Day2 python函数和常用模块(一),Day3 python函数和常用模块(二),Day4 python函数和常用模块(三),D ...
- Hibernate中的一对一关联和组件的映射
Hibernate提供了两种映射一对一映射关联关系的方式: 01.按照外键映射 02.按照主键映射 下面以员工账号表和员工档案表(员工账号和档案表之间是一对一的关系)为例,介绍这两种映射关系,并使用这 ...
- Ogre2.1 灯光与阴影
Ogre2.1大量光源渲染 Ogre2.1不是采用现在大部分引擎所用的延迟渲染,而是采用一种前向渲染的改进技术,理论基本来自于Forward+,见如下. http://www.klayge.org/? ...
- Java编程思想读书笔记之内部类
现在是够懒得了,放假的时候就想把这篇笔记写出来,一直拖到现在,最近在读<Java编程思想>,我想会做不止这一篇笔记,因为之前面试的时候总会问道一些内部类的问题,那这本书的笔记就从内部类开始 ...
- JS数组的forEach方法(兼容所有浏览器)
//->自己在内置类的原型上扩展一个myForEach来处理forEach不兼容的问题//callBack:回调函数,遍历数组中的一项,就要执行一次callBack//context:改变cal ...
- APP icon 自动来做,photoshop 做圆角图片
项目上传到应用市场,没有美工配合,那就只能自己捉刀了. 有几个点快捷键要注意,对使用ps有帮助 (1)ctrl+enter 建立选区 (2)建立选区后,移动到另外的图层,按delete键就为删除 (3 ...
- JAVA基础学习day20--IO流二-缓冲流、字节流
一.缓冲流 1.1.字符流的缓冲区 缓冲区的出现是为了提高IO的读写效率 对应类 BufferedReader BufferedWriter 缓冲区要结合流才可以使用 在流的基础上对流的功能进行了增强 ...