第-1-章-浏览器兼容性解决方案

第1章浏览器兼容性解决方案网站综合开发解析本章进阶了解兼容问题解决针对IE6.0、IE7.0和Firefox浏览器常见的兼容问题简介目前浏览器全球市场份额比例表简介目前IE6/7/8浏览器全球市场份额兼容性的由来浏览器的兼容问题浏览器的版本问题需要兼容的浏览器IE浏览器Firefox浏览器什么是基于IE内核的浏览器常用浏览器浏览器显示的差异IE6.0浏览器显示效果Firefox浏览器显示效果避免使用会产生兼容问题的CSS属性使用CSSHack解决兼容问题其它兼容方法兼容问题的解决原理｛属性：属性值！important｝!--[ifIE]此内容只有IE可见![endif]--!--[ifIE6.0]此内容只有IE6.0可见![endif]--CSSHack的使用针对IE的CSSHack针对Firefox的CSSHack针对IE7.0浏览器*+htmlselect{property:value;}针对IE6.0浏览器select{_property:value;}针对IE浏览器*select{property:value;}border:10pxsolid#000;*border:10pxsolid#F00!important;*border:10pxsolid#00F;border:10pxsolid#000;*border:10pxsolid#F00;_border:10pxsolid#00F;=盒子模型方面的Hack技术盒子模型浮动时的双倍外边距Bug处理只发生在IE6.0及以下版本盒子模型方面的Hack技术ul的问题ul{margin:0;padding:0;list-style-position:inside;}ul{margin:00015px;padding:0;}IE浏览器IE浏览器Firefox浏览器浏览器中常用的默认样式列表元素的默认样式ul{list-style-type:none;padding:0;}IE6.0浏览器IE6.0浏览器Firefox浏览器Firefox浏览器浏览器中常用的默认样式ul{list-style-type:none;margin-top:0;padding:0;}ul{list-style-type:none;margin:0;padding:0;}结论：Firefox浏览器中浏览器中常用的默认样式元素居中元素名称{margin:0auto;}注意：设置元素居中时，要设置该元素的宽度才有意义。IE浏览器中定义父元素的text-align的属性为center。父元素下的所有元素在默认下都居中。浏览器中常用的默认样式页边距Firefox浏览器中padding默认值为8像素。body{margin:0;padding:0;}IE浏览器中margin默认值为10像素。让IE8.0兼容IE7.0的模式metahttp-equiv=X-UA-Compatiblecontent=IE=EmulateIE7/X-UA-Compatible是针对IE8新加的一个设置，对于IE8之外的浏览器是不识别的。目前IE8尚在测试版中，可直接在页面的head的meta标签中加入如下代码：metahttp-equiv=X-UA-Compatiblecontent=IE=7/“盒子模型”被看做是一个矩形，由内容、填充、边框和边距构成。将div元素设置为margin:0auto,可以实现居中对齐。为了使IE8.0兼容IE7.0,在页面的head的meta标签中加入一段代码：metahttp-equiv=“X-UA-Compatible”content=“IE=7”。本章总结谢谢！