简化的CSS Reset — 常用CSS重设实例
作者:ximicc 来源:ximicc博客 发布时间:2009-03-11 16:46:00
CSS重设就是由于各种浏览器解释CSS样式的初始值有所不同,导致设计师在没有定义某个CSS属性时,不同的浏览器会按照自己的默认值来为没有定义的样式赋值,所以我们要先定义好一些CSS样式,来让所有浏览器都按照同样的规则解释CSS,这样就能避免发生这种问题.
在当今网页设计/开发实践中,使用CSS来为语义化的(X)HTML标记添加样式风格是重要的关键。在设计师们的梦想中都存在着这样的一个完美世界:所有的浏览器都能够理解和适用多有CSS规则,并且呈现相同的视觉效果(没有兼容性问题)。但是,我们并没有生活在这个完美的世界,现实中发生的失窃却总是恰恰相反,很多CSS样式在不同的浏览器中有着不同的解释和呈现。
当今流行的浏览器如:Firefox、Opera、Internet Explorer、Chrome、Safari等等,有一些都是以自己的方式去理解CSS规范,这就会导致有的浏览器对CSS的解释与设计师的CSS 定义初衷相冲突,使得网页的样子在某些浏览器下能正确按照设计师的想法显示,但有些浏览器却并没有按照设计师想要的样子显示出来,这就导致浏览器的兼容性问题。更糟的是,有的浏览器完全无视CSS的一些声明和属性。
正因为上述冲突和问题依然存在于这个”不完美的世界”,所以一些设计师想到了一种避免浏览器兼容性问题的方法,那就是CSS Reset。什么是CSS Reset?
我们可以把它叫做CSS重设,也有人叫做CSS复位、默认CSS、CSS重置等。CSS重设就是由于各种浏览器解释CSS样式的初始值有所不同,导致设计师在没有定义某个CSS属性时,不同的浏览器会按照自己的默认值来为没有定义的样式赋值,所以我们要先定义好一些CSS样式,来让所有浏览器都按照同样的规则解释CSS,这样就能避免发生这种问题。
最简化的CSS Reset(重设)
* {
padding: 0;
margin: 0;
}
这是最普遍最简单的CSS重设,将所有元素的padding和margin值都设为0,可以避免一些浏览器在理解这两个属性默认值上的”分歧”。
* {
padding: 0;
margin: 0;
border: 0;
}
这是在上一个重设的基础上添加了对border属性的重设,初始值为0的确能避免一些问题。
* {
outline: 0;
padding: 0;
margin: 0;
border: 0;
}
在前两个的基础上添加了outline属性的重设,防止一些冲突。


猜你喜欢
- 不论你做什么样的设计,色彩都是一个不容忽视的问题。色彩以一种“隐蔽”的方式传达的各种信息,这些信息会影响观看者的心理和感受,左右他们的判断和
- 本文为大家分享了mysql5.7.17安装配置方法,供大家参考,具体内容如下1、下载 MySQL 数据库的安装包:mysql-5.7.17.
- 这篇文章主要介绍了基于Python获取城市近7天天气预报,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的
- 关于Event:mysql5.1版本开始引进event概念。event既“时间触发器”,与triggers的事件触发不同,event类似与l
- ------谁正在访问数据库?Select c.sid, c.serial#,c.username,a.object_id,b.
- 有时候我们会截取字符串中的一些特殊想要的东西,大小写字母、模号、汉字、数字等等,今天先介绍一个获取字符串中小写字母(也是大写字母)的方式,直
- 1、说明这篇文章是帮一个群友解答的问题。他有一个需求,就是对于日期的录入都是中文形式的,需要转换为数字形式的。由于python库中没有函数直
- python queue队列类型及函数1.队列的种类Python queue模块的FIFO队列先进先出。 class queue.Queue
- 前言:时间戳的定义Unix时间戳(Unix时间戳)或称Unix时间(Unix时间),POSIX时间(POSIX时间),是一种时间表示方式,定
- 在pyplot模块中可以使用xlabel()和ylabel()函数设置x轴y轴的标签。这两个函数的使用方法非常相似。使用xlabel()设置
- >>> a = 2.5>>> b = 2.5>>> c = b>>>
- 本文实例为大家分享了php微信公众号获取位置信息的具体代码,供大家参考,具体内容如下<?php/** * wechat php tes
- Mysql迁移历史数据记录一下工作中由于业务需要以及系统的数据库模型变更,导致需要做一下历史数据迁移的解决办法需求陈述一共涉及到三张表,分别
- 这篇文章主要介绍了Python实现结构体代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以
- 本文讲述了python提示No module named images的解决方法,非常实用!分享给大家供大家参考。具体方法如下:出现提示:I
- 1、标准转换格式符号说明%a 本地星期的短名称 如:Sun, Mon, ..., Sat (en_US); So, Mo, ..., Sa
- flagflag 是Go 标准库提供的解析命令行参数的包。使用方式:flag.Type(name, defValue, usage)其中Ty
- CentOS安装Python1.CentOS已经自带安装了2.x版本,先尝试python命令检查已安装的版本.如果你使用rpm、yum或de
- PHP屏蔽蜘蛛访问代码代码:常用搜索引擎名与 HTTP_USER_AGENT对应值百度baiduspider谷歌googlebot搜狗sog
- 由于之前有一个项目老是要打开文件,然后用pickle.load(file),再处理。。。最后要关闭文件,所以觉得有点繁琐,代码也不简洁。所以