通常开始写css的时候,我都会先link一个reset.css

所谓reset,就是将html标签的样式都去掉,变成普通的标签的样子如

要reset的根本原因就是不同的浏览器对同一个标签样式的解析不一致,导致有些css在一个浏览器显示明明没问题,可是到了另一个浏览器则产生多多少少的错位等问题。加入了reset,就要对很多样式重写,即使你想让他保持原来的样子。

但是对于用户产生内容的网站来说,比如Blog,都用到了富文本可视化编辑器,而大部分编辑器都使用了execCommand来实现格式化的。execCommand在不同的浏览器会生成不同的代码,如“粗体”,执行execCommand('bold',null,false);之后,ie会生成<strong>,ff则生成<span style="font-weight: bold;"></span>,还有浏览器会生成<b>,如果使用了reset,则在ie等浏览器的富文本格式化会变成看起来无效的样子。

另一种情况就是要做对搜索引擎友好的网页时,像<strong>这些标签是很有用的。从语义上就知道<strong>是表示强调内容,一般粗体显示。但是如果reset了,则需要让<strong>里面填充style,或者用个带有style的span把strong里面的内容包括起来,无疑是自找麻烦。

对于这些情况,有两个解决方法:

  1. 去掉reset,哪个标签在哪个浏览器除了问题,再改相应的标签,但是可能会造成相同的代码在不同浏览器表现不完全一致;
  2. 使用reset,然后在要用到的地方使用css模拟回原来的样式

具体要怎么做就看个人喜好了。

附录:我自己使用的reset.css 跟据YUI库的reset.css和网上一些介绍以及自己的经验改写的。

Comments
Write a Comment

Tags

css3   魅力CSS   nodejs   loading   CSS   疯狂的菊花   html5   animation   compiler   编译脚本   png   WordPress   智能   旅行   优化   模板   历史记录   跨域   manifest   frame   canvas   动画   js   离线应用   codelet   transform   抽取   java   兼容问题   发布脚本   富文本   那一年在他乡   htaccess   iframe   帧动画   加载速度   intelligent   跨浏览器   DNS解析   插件   checkbox   单边   step-start   vary   复选框   自动更新   转换   文本溢出   盒子阴影   menu   blob   西安   滑动背景   box-shadow   内存占用   键盘事件   python   auto   text overflow   background   所见所得   android   rotate   字节数   合并   文本框   slide   字符串连接符   协议   伪类   兄弟选择符   网格   节点位置比较   空白   斜线拼接   自定义命令   溢出   clock   素描   无法更新   分隔符   字符编码   body   下载文件   精灵图   step   nodej   ubuntu   apache   css3选择器   创建文件   多级菜单   编辑状态   ajax   阴影   垂直   chrome   管道   时钟   firefox   背景   文件上传   createobjecturl   游记   下载   放射渐变   版本号   宽高   照片   localStorage   渐变背景   图片   图片拼接   属性值检测   自动生成   计算   返回键   oauth   合图   reset   调用   cavnas   漏洞   按钮   margin   线性渐变   xsrf   被黑   tab   checked   修复   border   消失   step-end   sprite   common-upload   菜单   兄弟选择器   字符串   svn   九寨沟   缩进   css遮罩   svg   添加系统服务   gzip   插入代码   动态   加速   模拟