不同的浏览器对CSS文件,的解析方式不同,最著名的也就是占有垄断地位的微软的IE浏览器。多年以前微软就凭借着windows系统的优势捆绑着IE浏览器打击竞争对手,不过还有Mozilla firefox也具有着非常深厚的实例,和开源的优势,占据着一定的市场份额。它们对CSS和javascript有着不同的解析方式,就像是不同的眼光去看一件事务也是不同的。
IE VS FireFox CSS 兼容要点:DOCTYPE 影响 CSS 处理FIREFOX: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行FIREFOX: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中FIREFOX: 支持 !important, IE 则忽略, 可用 !important 为 FIREFOX 特别设置样式FIREFOX: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 height 和 width, 如:height:30px !important; /* 这个 height 样式只对FIREFOX起作用 */ div 的垂直居中问题: vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行cursor: pointer 可以同时在 IE FIREFOX 中显示游标手指状, hand 仅 IE 可以FIREFOX: 链接加边框和背景色,需设置 display: block, 同时设置 float: left 保证不换行。参照 menubar, 给 a 和 menubar 设置高度是为了避免底边显示错位, 若不设 height, 可以在 menubar 中插入一个空格xhtml+CSS兼容性解决方案小集使用xhtml+CSS构架好处不少,但也确实存在一些问题,不论是因为使用不熟练还是思路不清晰,我就先把一些我遇到的问题写在下面。
1.在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法:div{margin:30px!important;margin:28px;}注意这两个margin的顺序一定不能写反,据阿捷的说法!important这个属性IE不能识别,但别的浏览器可以识别。所以在IE下其实解释成这样:div{maring:30px;margin:28px}重复定义的话按照最后一个来执行,所以不可以只写margin:XXpx!important;2.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义ul{margin:0;padding:0;} IE支持自定义光标文件cursor:url()
IE支持自定义滚动条颜色风格IE6中的select有永远处在最上的bug,而且css对select不起作用。
在form中,IE支持label,包括文字和图片;但是firefox不支持图片的label,点击图片不能让label for的radio或者checkbox产生效果。
IE和firefox都是支持onscroll事件的,但是firefox中textarea对此事件不支持。
CSS方面,IE中支持在CSS中嵌入expresion,而Firefox不支持firefox支择相邻子选择符“>”,而IE6不支持(IE7支持)
firefox 对display的inline-block不支持,而IE均支持
本v
分享到:
相关推荐
CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页...
xhtml布局实例说明书xhtml布局实例说明书xhtml布局实例说明书xhtml布局实例说明书
xhtml布局实例说明书例子代码 java学习代码 实用无敌的代码 需要的下哦
属性、浏览器兼容与网页布局内容简介:《别具光芒CSS属性、浏览器兼容与网页布局》结合大量范例与实际应用的实例,详细介绍了W3C发布的层叠样式表CSS2.1规范,浏览器对于CSS2.1规范解释的异同,以及使用XHTML和层叠...
对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后...
精通XHTML 程序设计高级教程----web programming的好书 精通XHTML 程序设计高级教程----web programming的好书
This handy, one–stop guide catches you up on XHTML basics and CSS fundamentals. You′ll learn how to work with Positionable CSS to create floating elements, margins, and multi–column layouts, and ...
html-xhtml-and-css-your-visual-blueprint-for-designing-effective-web-pages
Accessible XHTML and CSS Web Sites - Problem - Design - Solution - 2005
( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ( xhtml1-strict.dtd ...
简介: 深入浅出HTML与CSS、XHTML(中文版)--源代码(2)
12天学会DIV+CSS从理论到实践的教程,强烈推介。...第六天:XHTML代码规范 第七天:CSS入门 第八天:CSS布局入门 第九天:第一个CSS布局实例 第十天:自适应高度 十一天:不用表格的菜单 十二天:校验及常见的错误
最全的CSS浏览器兼容问题 CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写...
40种XHTML页面布局40种XHTML页面布局40种XHTML页面布局40种XHTML页面布局40种XHTML页面布局
xwiki-rendering.zip,xwiki呈现-语法-xhtmlhe xwiki呈现引擎
官方离线安装包,测试可用。使用rpm -ivh [rpm完整包名] 进行安装
网上好多人说这本书不错,不过还没看,我是跟着网上找的视频学习的,以后有时间再看看是否有说得这么好!
div+css浏览器兼容E7,6与Fireofx 从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名.
本书结合大量范例与实际应用的实例,详细介绍了W3C发布的层叠样式表CSS 2.1规范,浏览器对于CSS 2.1规范解释的异同,以及使用XHTML和层叠样式表对网页进行结构化与美化的实际制作方法。本书内容由浅入深,不仅介绍...