浏览器兼容性问题解决方法
浏览器兼容性问题解决方法
一、HA CK
以下两种方法几乎能解决现今所有HACK。
1, !important
随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)
2, IE6/IE77对火狐
*+html 与*html 是IE特有的标签, 火狐暂不支持.而*+html 又为IE7特有标签.
注意:
*+html 对IE7的HACK 必须保证HTML顶部有如下声明：
"https://www.360docs.net/doc/a28748214.html,/TR/html4/loose.dtd">
二、万能float 闭合
关于clear float 的原理可参见[How To Clear Floats Without Structural Markup] 将以下代码加入Global CSS 中,给需要闭合的div加上class="clearfix" 即可,屡试不爽.
三、其他兼容技巧
1, FF下给div 设置padding 后会导致width 和height 增加, 但IE不会.(可
用!important解决)
2, 居中问题.
垂直居中.将line-height 设置为当前div 相同的高度, 再通过vertical-align: middle.( 注意内容不要换行.)
水平居中. margin: 0 auto;(当然不是万能)
3, 若需给a 标签内内容加上样式, 需要设置display: block;(常见于导航标签)
4, FF 和IE 对BOX 理解的差异导致相差2px 的还有设为float的div在ie下margin加倍等问题.
5, ul 标签在FF 下面默认有list-style 和padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表)
6, 作为外部wrapper 的div 不要定死高度, 最好还加上overflow: hidden.以达到高度自适应.
7, 关于手形光标. cursor: pointer. 而hand 只适用于IE.
四、部分样式兼容技巧
1 针对火狐ie6 ie7的css样式
现在大部分都是用!important来hack，对于ie6和火狐测试可以正常显示，但是ie7对!important可以正确解释，会导致页面没按要求显示！找到一个针对IE7不错的hack 方式就是使用“*+html”，现在用IE7浏览一下，应该没有问题了。
现在写一个CSS可以这样：
#1 { color: #333; } /* Moz */
* html #1 { color: #666; } /* IE6 */
*+html #1 { color: #999; } /* IE7 */
那么在火狐下字体颜色显示为#333，IE6下字体颜色显示为#666，IE7下字体颜色显示为#999。
2 css布局中的居中问题
主要的样式定义如下：
body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }
说明：
首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。
但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ”需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div，只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。
3 盒模型不同解释
#box{ width:600px; //for ie6.0- width:500px; //for ff+ie6.0}
#box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}
4 浮动ie产生的双倍距离
#box{ float:left; width:100px; margin:0 0 0 100px; //这种情况之下IE会产生200px的距离
display:inline; //使浮动忽略}
这里细说一下block,inline两个元素,Block元素的特点是:总是在新行上开始,高度,宽度,行高,边距都可以控制(块元素);Inline元素的特点是:和其他元素在同一行上,...不可控制(内嵌元素);
#box{ display:block; //可以为内嵌元素模拟为块元素
display:inline; //实现同一行排列的的效果
diplay:table;
IE不认得min-这个定义，但实际上它把正常的width和height当作有min的情况来使。这样问题就大了，如果只用宽度和高度，正常的浏览器里这两个值就不会变，如果只用min-width和min-height的话，IE下面根本等于没有设置宽度和高度。
比如要设置背景图片，这个宽度是比较重要的。要解决这个问题，可以这样：
#box{ width: 80px; height: 35px;}
html>body
#box{ width: auto; height: auto; min-width: 80px; min-height: 35px;}
6 页面的最小宽度
min-width是个非常方便的CSS命令，它可以指定元素最小也不能小于某个宽度，这样就能保证排版一直正确。但IE不认得这个，而它实际上把width当做最小宽度来使。为了让这一命令在IE上也能用，可以把一个
然后CSS这样设计：
#container{ min-width: 600px; width:expression(document.body.clientWidth < 600? "600px": "auto" );}
第一个min-width是正常的；但第2行的width使用了Javascript，这只有IE才认得，这也会让你的HTML文档不太正规。它实际上通过Javascript的判断来实现最小宽度。
7 清除浮动
.hackbox{ display:table; //将对象作为块元素级的表格显示}或
者.hackbox{ clear:both;}
或者加入:after（伪对象）,设置在对象后发生的内容，通常和content配合使用，IE不支持此伪对象，非Ie 浏览器支持，所以并不影响到IE/WIN浏览器。这种的最麻烦的......#box:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
8 DIV浮动IE文本产生3象素的bug
左边对象浮动，右边采用外补丁的左边距来定位，右边对象内的文本会离左边有3px的间距.
#box{ float:left; width:800px;}
#left{ float:left; width:50%;}
#right{ width:50%;}
*html #left{ margin-right:-3px; //这句是关键}
HTML代码
9 属性选择器(这个不能算是兼容,是隐藏css的一个bug)
p[id]{}div[id]{}
这个对于IE6.0和IE6.0以下的版本都隐藏,FF和OPera作用。属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的.
10 IE捉迷藏的问题
当div应用复杂的时候每个栏中又有一些链接，DIV等这个时候容易发生捉迷藏的问题。
有些内容显示不出来，当鼠标选择这个区域是发现内容确实在页面。
解决办法：对#layout使用line-height属性或者给#layout使用固定高和宽。页面结构尽量简单。
11 高度不适应
高度不适应是当内层对象的高度发生变化时外层高度不能自动进行调节，特别是当内层对象使用
margin 或paddign 时。
例：
p对象中的内容
CSS：#box {background-color:#eee; }
#box p {margin-top: 20px;margin-bottom: 20px; text-align:center; }
解决方法：在P对象上下各加2个空的div对象CSS代码：.1{height:0px;overflow:hidden;}或者为DIV加上border属性。
浏览器兼容性案例分析
浏览器兼容性案例分析： 1.不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。 碰到频率:100% 解决方案：CSS里 *{margin:0;padding:0;} 备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。 2.IE6下不支持png图片 问题症状：IE6下不显示png图片。 碰到频率:100% 解决方案： 3.IE6下不支持:hover 问题症状：IE6下不支持:hover。 碰到频率:100% 解决方案：改成js方法 4.相同名称的样式被定义了多次，但不知道在定义在哪里 问题症状：相同名称的样式被定义了多次，但不知道定义在哪里，导致样式冲突。 碰到频率:100% 解决方案：最简单的办法是在样式后面添加!important，这样可以保持这个样式一直被调用。 .bHidden { display:none !important; }
5.单行双列自适应宽度，IE6中出现错行现象解决办法 问题症状： 调整单行双列自适应宽度布局，随着浏览器窗口大小自动改变left和right层的宽度。代码如下：
IE11兼容性设置方法及常见问题处理方法
1 IE11兼容性设置方法及常见问题处理方法 在我们的日常生活中，经常打开一些如银行网银、QQ 空间、一些公司内网网站，但是由于新的IE 可能与现有网页的版本存在兼容性问题，可能出现插件无法安装，网页无法打开情况，这就需要考虑使用兼容性设置的方法来解决以上问题，下面详细说明设置方法： 1）打开ie,点击设置“齿轮”，再点击兼容性视图设置，如下图： 2）点击“添加”按钮来添加要使用兼容模式的网站，并点击“关闭”；
2 3）在桌面IE 模式中，按键盘“F12”按钮调出左侧；黑色菜单，如右图，选择最后一项，将用户代理；字符串选择为IE10、IE8、IE7、IE6试试。 IE 11常见问题问题及处理方法： Q ：腾讯QQ 空间、QQ 音乐、DZ 论坛无法正常浏览 A ：目前暂无更好解决方案，只能尝试使用兼容性设置，若无效建议等待以上网站更新以支持最新的IE11增强保护模式暂不完善。 Q ：无法新建选项卡，,首页设置为空白打开出错，工行网银助手无法正常使用 A ：IE 选项-高级取消"启用增强保护模式"勾选，确定，关闭并重新打开IE 即可恢复。 Q ：优酷等视频网站无法浏览，支付宝、建行等插件无法正常使用 A ：点击兼容性视图按钮即可，如果无法显示兼容性视图按钮，点击工具-兼容性视图设置，添加https://www.360docs.net/doc/a28748214.html, （支付宝）、https://www.360docs.net/doc/a28748214.html, （建行），安装插件后即可正常登录，如果还是不行，可以安装其他浏览器试试。 Q ：网页字体模糊，或者各种显示异常。兼容性视图无效 A ：打开Internet 选项，高级选项卡，将“加速的图形”分类下的“使用软件呈现而不使用GPU 呈现”勾选，确定，关闭并重新打开IE 即可。
浏览器兼容性问题及解决方案
浏览器兼容新问题 W3C对标准的推进，Firefox，Chrome，Safari，Opera的出现，结束了IE雄霸天下的日子。 然而，这对开发者来说，是好事，也是坏事。 说它是好事，是因为浏览器厂商为了取得更多的市场份额，会促使各浏览器更符合W3C标准，而得到更好的兼容性，并且，不同浏览器的扩展功能(例如-moz，-webkit开头的样式)，对W3C标准也是个推进；说它是坏事，因为，多个浏览器同时存在，这些浏览器在处理一个相同的页面时，表现有时会有差异。这种差异可能很小，甚至不会被注意到；也可能很大，甚至造成在某个浏览器下无法正常浏览。我们把引起这些差异的问题统称为“浏览器兼容性问题”。而正是这些“浏览器兼容性问题”，无形中给我们的开发增加了不少难度。 从浏览器内核的角度来看，浏览器兼容性问题可分为以下三类： 1. 渲染相关：和样式相关的问题，即体现在布局效果上的问题。 2. 脚本相关：和脚本相关的问题，包括JavaScript和DOM、BOM方面的问题。对于某些浏览器的功能方面的特性，也属于这一类。 3. 其他类别：除以上两类问题外的功能性问题，一般是浏览器自身提供的功能，在内核层之上的。 例如下面的页面，是一个渲染相关的问题： 在各个浏览器中都表现的不同，这就属于兼容性问题。 造成浏览器兼容性问题的根本原因就是浏览器各浏览器使用了不同的内核，并且它们处理同一件事情的时候思路不同。 现今常见的浏览器及其排版引擎（又称渲染引擎）及脚本引擎，如下：
而造成浏览器兼容性问题的常见原因则是设计师写出了不规范的代码，不规范的代码会使不兼容现象更加突出。 例如： 不规则的嵌套： DIV 中直接嵌套LI 元素是不合标准的，LI 应该处于UL 内。此类问题常见的还有P 中嵌套DIV，TABLE等元素。 不规范的DOM接口和属性设置： 总之，人为的原因也占很大一部分。而人为造成兼容性问题的原因，除了粗心之外，大都源于浏览器bug 的存在，和开发者对标准的不了解。 比如，如果要做一个功能，功能是想让鼠标悬停在IMG 元素上方时，可以出现提示信息，经常针对IE 做开发的人，可能会使用IMG 元素的“alt” 属性，但其他浏览器中就是不给…alt? 属性面子。因为W3C 标准中规定要去做这件事的属性是”title“，大多浏览器符合标准，IE 不符合，这是IE 浏览器内核的问题；开发者不知道”title“ 才是正解，不遵循标准去写代码，是开发者的问题。所以，一个问题分两半，浏览器和开发者都有责任。 既然都有责任，就都有义务去解决兼容性问题。那么，从浏览器的角度来讲，它的厂商应该修复浏览器的bug和不合标准的地方，当某一天IE 的”alt“ 不能用于提示了，还有人用这个错误的属性去显示提示么？从开发者角度来讲，多了解标准，了解浏览器兼容性问题，就可以在开发的过程中，有效的避开兼容性问题，让你的页面在所有浏览器中畅通无阻。 废话少说，下面就讲讲如何有效的避免一些兼容性问题。 J AVA S CRIPT (4)
浏览器间不兼容的原因及解决办法
网页设计遇到最大的麻烦之一莫过于网页对不同浏览器的兼容性问题了，因为IE 6.0 / IE 7.0 / firefox 2 / Opera 9等主流浏览器对CSS解析不近相同，导致设计的页面效果不一样，所以用什么方法可以有效解决不同浏览器不同页面效果的问题呢？广泛被使用的方法就是CSS Hack，即使用特别的CSS定义显示网页在不同浏览器的设计风格，针对不同的浏览器去写不同的CSS，最大化兼容浏览器。 一般情况下，我都会兼顾IE 6.0 / IE 7.0 / firefox 2.0浏览器，下面是用的较频繁的CSS Hack技巧： 用的最广莫过于!important了，它可以针对IE（IE 7.0能正确理 解!important）和非IE浏览器设置不同的样式，只要在非IE浏览器样式的后面加上!important，就可以针对其优先了。所以为了兼顾IE 6.0与火狐之间的差异，我都会使用!important。 1、仅IE7与IE5.0可以识别 *+html select {…} 当面临需要只针对IE7与IE5.0做样式的时候就可以采用这个HACK。 2、仅IE7可以识别 *+html s elect {…!important;} 当面临需要只针对IE7做样式的时候就可以采用这个HACK。 3、IE6及IE6以下识别 * html select {…} 这个地方要特别注意很多博客都写成了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。 4、html/**/ >body select {…}
这句与上一句的作用相同。 5、仅IE6不识别，屏蔽IE6 select { display /*屏蔽IE6*/:none;} 这里主要是通过CSS注释分开一个属性与值，注释在冒号前。 6、仅IE6与IE5不识别，屏蔽IE6与IE5 select/**/ { display /*IE6,IE5不识别*/:none;} 这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。不屏蔽IE5.5 7、仅IE5不识别，屏蔽IE5 select/*IE5不识别*/ {…} 这一句是在上一句中去掉了属性区的注释。只有IE5不识别，IE5.5可以识别。 8、盒模型解决方法 selct {width:IE5.x宽度; voice-family :”/”}/”"; voice-family:inherit; width:正确宽度;} 盒模型的清除方法不是通过!important来处理的。这点要明确。 9、只有Opera识别 @media all and (min-width: 0px){ select {……} } 针对Opera浏览器做单独的设定。 以上都是写CSS中的一些HACK，这些都是用来解决局部的兼容性问题，如果希望把兼容性的内容也分离出来，不妨试一下下面的几种过滤器。这些过滤器有的是写在CSS中通过过滤器导入特别的样式，也有
浏览器兼容性常见问题
1.注释标签常用语法 1.1注释的注意事项
1.2出错条件 1.3注释中多个地方出错时
1.4两个出错的注释标签，其间的内容被视为注释的一部分 1.5解决方案 2.浏览器的字符编码 2.1问题描述 各浏览器对于字符编码别名支持的宽泛程度有差异，当指定了浏览器无法识别的字 符编码别名时，浏览器会以确定编码的优先级顺序采用设置的更低优先级的字符编码， 以此类推。而 Chrome Safari Opera 中对字符编码别名有着比其他浏览器更宽泛的支持。
2.2文档的字符编码顺序 针对如何确定一个文档的字符编码，用户代码必须遵守下面的优先级顺序（优先级由高至低）： （1）HTTP "Content-Type" 字段中的 "charset" 参数。 （2）META 声明中 "http-equiv" 为 "Content-Type" 对应的值中的 "charset" 的值。（3）元素的 charset 属性。 2.3实例1 上面是一段 PHP 代码，HTTP "Content-Type" 头字段设置了字符编码为 BIG5，页面中的 META 元素设置了字符编码为 UTF-8，页面本身的编码类型为 GB2312。页面执行时，通过脚本输出了当前浏览器所采用的字符编码类型。 这个动态页面在各浏览器中运行时均显示出了 BIG5，可见此时所有浏览器均遵照HTML4.01 规范所述，以更高优先级的 HTTP "Content-Type" 头字段的 "charset" 参数的值作为字符编码类型。
2.4各浏览器默认编码格式 上面页面中没有设定任何的字符编码信息，则各浏览器对于这个页面将使用各自的默认编码。页面自身的编码为 GB2312。 各浏览器中运行效果如下： 2.5实例2 上面的动态页面自身的编码为 BIG5，HTTP "Content-Type" 头字段设置了字符编码为 maccyrillic，页面中的 META 元素设置了字符编码为 b.i.g+5。 各浏览器中运行效果如下：
USB 3.0 验证、除错和相容性解决方案
Mastering USB Physical Layer Validation
Tektronix USB Testing Solutions Introduction
Sarah Boen
Agenda
? ?
Introduction USB 3.0 SuperSpeed
– – – – – – Why USB 3.0? Timeline Cable Transmitter Receiver Protocol analysis
?
USB 2.0
– Introduction – Compliance Testing
?
Wireless USB
– Overview – Compliance and Debug
Disclaimer: The material and content that describes specific details of the USB 3.0 specification (and SuperSpeed logo) belong to the USB 3.0 Promoters. Tektronix is not speaking or presenting on behalf of the USB 3.0 Promoters.
2
2009-4-10
Tektronix Innovation Forum 2009
USB Industry Leadership
? ? ? ?
Tektronix 1st to market for USB 2.0 Only approved Method of Implementation (MOI) for WiMedia PHY Leadership in USB Millions of certified products shipped, enabled by Tektronix USB solutions Tektronix is only T&M Technical Contributor in the USB 3.0 specification!
3
2009-4-10
Tektronix Innovation Forum 2009
Windows系统下各浏览器兼容性
Windows系统下各浏览器常用CSS HACK汇总表 1. 此汇总表中测试浏览器的版本为： 微软系统自带：IE6、 IE7、IE8 火狐：Firefox 3.6.6 Safari：Safari 5.0 谷歌浏览器：Chrome 6.0.458.1 dev Opera浏览器：Opera 10.60 2. 其中，多数CSS hack是在selector{property:value;}基础上更改的。 selector代表CSS选择器，property代表CSS特性，value代表特性的值。 3. FF代表Firefox，Ch代表Chorme，Sa代表Safari，Op代表Opera 4. Q代表Quirks Mode，S代表Standards Mode。 5. Hack Type列的数字，指的是上面CSS hack的实现方式中的列表号。 1是指“利用浏览器对相同代码的解析和支持的不同实现的hack”，2是指以Firefox或Webkit特有的扩展样式实现的hack。
一定遵守CSS hack的三条原则。CSS hack是没有办法的时候才使用的解决兼容性问题的招术，是用兼容性问题去解决兼容性问题，无异于饮鸩止渴。切莫一有兼容性问题就使用，时刻记得改掉用CSS hack修补的问题。 IE6、IE7、IE8、Firefox兼容性CSS HACK代码+示例 1.区别IE和非IE浏览器CSS HACK代码 #divcss5{ background:blue; /*非IE 背景藍色*/ background:red \9; /*IE6、IE7、IE8背景紅色*/ } 2.区别IE6,IE7,IE8,FF CSS HACK 【区别符号】：「\9」、「*」、「_」 【示例】： #divcss5{ background:blue; /*Firefox 背景变蓝色*/ background:red \9; /*IE8 背景变红色*/ *background:black; /*IE7 背景变黑色*/ _background:orange; /*IE6 背景变橘色*/ } 【说明】：因为IE系列浏览器可读「\9」，而IE6和IE7可读「*」(米字号)，另外IE6可辨识「_」(底线)，因此可以依照顺序写下来，就会让浏览器正确的读取到自己看得懂得CSS语法，所以就可以有效区分IE各版本和非IE浏览器(像是Firefox、Opera、Google Chrome、Safari等)。 3.区别IE6、IE7、Firefox (EXP 1) 【区别符号】：「*」、「_」 【示例】： #divcss5{ background:blue; /*Firefox背景变蓝色*/ *background:black; /*IE7 背景变黑色*/ _background:orange; /*IE6 背景变橘色*/ } 【说明】：IE7和IE6可读「*」(米字号)，IE6又可以读「_」(底线)，但是IE7却无法读
CSS浏览器兼容性的各种代码解决方案
CSS浏览器兼容性的各种代码解决方案 https://www.360docs.net/doc/a28748214.html,/webds/blog/item/0fc34990dbef5a8ba877a4d1.html 网页设计遇到最大的麻烦之一莫过于网页对不同浏览器的兼容性问题了，因为IE 6.0 / IE 7.0 / firefox 2 / Opera 9等主流浏览器对CSS解析不近相同，导致设计的页面效果不一样，所以用什么方法可以有效解决不同浏览器不同页面效果的问题呢？广泛被使用的方法就是CSS Hack，即使用特别的CSS定义显示网页在不同浏览器的设计风格，针对不同的浏览器去写不同的CSS，最大化兼容浏览器。 一般情况下，我都会兼顾IE 6.0 / IE 7.0 / firefox 2.0浏览器，下面是用的较频繁的CSS Hack技巧： 用的最广莫过于!important了，它可以针对IE（IE 7.0能正确理解!important）和非IE浏览器设置不同的样式，只要在非IE浏览器样式的后面加上!important，就可以针对其优先了。所以为了兼顾IE 6.0与火狐之间的差异，我都会使 用!important。 1、仅IE7与IE5.0可以识别 *+html select {…} 当面临需要只针对IE7与IE5.0做样式的时候就可以采用这个HACK。 2、仅IE7可以识别 *+html select {…!important;} 当面临需要只针对IE7做样式的时候就可以采用这个HACK。 3、IE6及IE6以下识别 * html select {…} 这个地方要特别注意很多博客都写成了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。 4、html/**/ >body select {…} 这句与上一句的作用相同。 5、仅IE6不识别，屏蔽IE6 select { display /*屏蔽IE6*/:none;} 这里主要是通过CSS注释分开一个属性与值，注释在冒号前。 6、仅IE6与IE5不识别，屏蔽IE6与IE5 select/**/ { display /*IE6,IE5不识别*/:none;} 这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。不屏蔽 IE5.5 7、仅IE5不识别，屏蔽IE5 select/*IE5不识别*/ {…} 这一句是在上一句中去掉了属性区的注释。只有IE5不识别，IE5.5可以识别。 8、盒模型解决方法 selct {width:IE5.x宽度; voice-family :”\”}\”"; voice-family:inherit; width:正确宽度;} 盒模型的清除方法不是通过!important来处理的。这点要明确。 9、只有Opera识别 @media all and (min-width: 0px){ select {……} }
关于浏览器兼容性问题
关于浏览器兼容性问题 制作网页时总会遇到各种浏览器的兼容性问题，工作也有一段时间了，做了一点小总结希望分享给大家，共同进步。 1、float定位。 Float定位是css排版中的非常重要的手段，属性float值：left、right、none（默认值），当设定了元素向左或者向右浮动时，元素会向其父元素的左侧或右侧靠紧。 在用float的同时我们要注意到 （1）float元素的父元素不能指定clear属性。 这是因为MaeIE下如果对float的元素父元素使用clear属性，周围的float元素布局就会混乱。 （2）float元素无比知道那个width属性 很多浏览器在显示未指定width的float元素时会有bug，所以不管float元素的内容如何，一定要为其制定width属性。（注意：制定元素时尽量使用em而不是px）（3）float元素不能指定margin和padding的属性 ie在显示指定了margin和padding的float元素时有bug。你可以再float元素内部嵌套一个div来势之margin和padding，也可以使用hack方法为ie指定特定的值。 （4）float元素之核的宽度要小于100% 如果float元素的宽度和正好等于100%，为保证大多浏览器显示正常，要是宽度之和小于100 2、margin加倍的问题。 设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。 解决方案是在这个div里面加上display:inline; margin:5px;/*IE下理解为10px*/ display:inline;/*IE下再理解为5px*/ 3、ie6中莫名出现多余的字符 我遇到的现象是：ie6下有些问题，重复出现在第二行，就是某些段落或某些文字的末尾N个字符，他另起一行重复出现，在选选着重复出现的文字时，原有的文字也被选中 解决方法：很简单，在重复出现文字的末尾补N个 ；就可以。 4、ie7中正常，但ie8中不正常，div的位置position：absolute在ie8中不起作用 解决方法：设置html兼容ie7，在head下加 5、针对ie 6、ie 7、火狐浏览器 (1)Ie6 、FF对!important;测试正常 Ie7对!important;可以正确解释。 为了使他们都正常： #style1{color：#333；} FF正常显示#333； *html #style1{color：#666；} ie6显示#666 *+html #style1{color：#999；} ie7显示#999 *+html与*html是ie特有的标签，firefox暂不支持，而*+html又为ie7特有的标签。 注意：顺序不能错了。 (2)FF: 链接加边框和背景色，需设置display: block, 同时设置float: left 保证不换行。 参照menubar, 给 a 和menubar 设置高度是为了避免底边显示错位, 若不设height,
最全整理浏览器兼容性问题与解决方案样本
常用浏览器兼容性问题与解决方案所谓浏览器兼容性问题，是指由于不同浏览器对同一段代码有不同解析，导致页面显示效果不统一状况。在大多数状况下，咱们需求是，无论顾客用什么浏览器来查看咱们网站或者登陆咱们系统，都应当是统一显示效果。因此浏览器兼容性问题是前端开发人员经常会遇到和必要要解决问题。 在学习浏览器兼容性之前，我想把前端开发人员划分为两类： 第一类是精准按照设计图开发前端开发人员，可以说是精准到1px，她们很容易就会发现设计图局限性，并且在很少状况下会遇到浏览器兼容性问题，而这些问题往往都死浏览器bug，并且她们制作页面后期易维护，代码重用问题少，可以说是比较牢固放心代码。 第二类是基本按照设计图来开发前端开发人员，诸多细枝末节差距很大，不如间距，行高，图片位置等等经常会差几px。某种效果实现也是重复调试得到，详细为什么浮现这种效果还模模糊糊，整体布局十分脆弱。稍有改动就乱七八糟。代码为什么这样写还不知因此然。此类开发人员往往经常为兼容性问题所困。修改好了这个浏览器又乱了另一种浏览器。改来改去也毫无头绪。其实她们遇到兼容性问题大某些不应当归咎于浏览器，而是她们技术自身了。 文章重要针对是第一类，严谨型开发人员，因而这里重要从浏览器解析差别角度来分析兼容性问题。 浏览器兼容问题一：不同浏览器标签默认外补丁和内补丁不同 问题症状：随便写几种标签，不加样式控制状况下，各自margin 和padding差别较大。 遇到频率:100% 解决方案：CSS里*
备注：这个是最常用也是最易解决一种浏览器兼容性问题，几乎所有CSS文献开头都会用通配符*来设立各个标签内外补丁是0。 浏览器兼容问题二：块属性标签float后，又有横行margin状况下，在IE6显示margin比设立大 问题症状:常用症状是IE6中背面一块被顶到下一行 遇到频率：90%（稍微复杂点页面都会遇到，float布局最常用浏览器兼容问题）解决方案：在float标签样式控制中加入display:inline;将其转化为行内属性 备注：咱们最惯用就是div+CSS布局了，而div就是一种典型块属性标签，横向布局时候咱们普通都是用div float实现，横向间距设立如果用margin实现，这就是一种必然会遇到兼容性问题。 浏览器兼容问题三：设立较小高度标签（普通不大于10px），在IE6，IE7，遨游中高度超过自己设立高度 问题症状：IE6、7和遨游里这个标签高度不受控制，超过自己设立高度 遇到频率：60% 解决方案：给超过高度标签设立overflow:hidden;或者设立行高line-height 不大于你设立高度。 备注：这种状况普通出当前咱们设立小圆角背景标签里。浮现这个问题因素是IE8之前浏览器都会给标签一种最小默认行高高度。虽然你标签是空，这个标签高度还是会达到默认行高。 浏览器兼容问题四：行内属性标签，设立display:block后采用float布局，又有横行margin状况，IE6间距bug 问题症状：IE6里间距比超过设立间距 遇到几率：20%
浏览器兼容性bug
常见浏览器兼容性问题与解决方案 标签：前端开发浏览器兼容问题 所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。 在学习浏览器兼容性之前，我想把前端开发人员划分为两类： 第一类是精确按照设计图开发的前端开发人员，可以说是精确到1px的，他们很容易就会发现设计图的不足，并且在很少的情况下会碰到浏览器的兼容性问题，而这些问题往往都死浏览器的bug，并且他们制作的页面后期易维护，代码重用问题少，可以说是比较牢固放心的代码。 第二类是基本按照设计图来开发的前端开发人员，很多细枝末节差距很大，不如间距，行高，图片位置等等经常会差几px。某种效果的实现也是反复调试得到，具体为什么出现这种效果还模模糊糊，整体布局十分脆弱。稍有改动就乱七八糟。代码为什么这么写还不知所以然。这类开发人员往往经常为兼容性问题所困。修改好了这个浏览器又乱了另一个浏览器。改来改去也毫无头绪。其实他们碰到的兼容性问题大部分不应该归咎于浏览器，而是他们的技术本身了。 文章主要针对的是第一类，严谨型的开发人员，因此这里主要从浏览器解析差异的角度来分析兼容性问题。（相关文章推荐：主流浏览器CSS 3和HTML 5兼容清单） 浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。 碰到频率:100% 解决方案：CSS里 *{margin:0;padding:0;} 备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。
c++w7兼容性问题解决方法
网上成千上万的诸如“有没有Win7兼容的VC6的下载”、“Win7下Visual C++ 6.0不兼容问题” 之类的问题， 多数意思是VC6和Win7不兼容，而现在不少学校或是考试用的还是Visual Studio套件， 新的Win7或Vista系统下要安装怎么办？ 说实话我也一直没有试过，所以也想当然的认为Win7下就不能安装VC6，压根就100%不兼容？ 一直使用高版本的VS（如VS2008和现在用的VS2010）的我今天亲身在Win7下安装一次试试。 为了说明问题，我这里下载了一个简体中文版的（点击进入下载Visual C++ 6.0 简体中文企业版集成SP6完美版）解压后运行SETU.EXE 运行setup.exe安装程序，会弹出如下的的程序兼容性助手提示框， 这个是Win7在警告用户vc6存在兼容性问题：此程序存在已知的兼容性问题。如下图，选中不再显示此消息，点“运行程序”。
（之后再有遇到“此程序存在已知的兼容性问题”的提示时候，也按这个做法处理！） 接着安装，进入选择安装类型这一步的时候，要注意。点“Custom”自定义安装类型： Custom自定义安装里，点中Tools组件，更改选项：
把其中的OLE/Com Object Viewer取消，不选择：
再返回到组件选择的时候，Tools就变为灰色的勾了， 因为里面我们取消了OLE/Com Object Viewer这一顶： 其他的就默认安装就可以了，要注意的上面已经都交代了，安装完成，出现安装成功的提示：
安装完成后，启动VC6的时候，也出现“此程序存在已知的兼容性问题”的提示， 按上面第一步中的处理：选中不再显示此消息，点“运行程序”。 启动后我们新建一个工程和一个c++源文件，编译运行之，如下 图：
各种浏览器兼容问题列表
各种浏览器兼容问题列表 1、仅IE7与IE5.0可以识别 *+html select {…} 当面临需要只针对IE7与IE5.0做样式的时候就可以采用这个HACK。 2、仅IE7可以识别 *+html select {…!important;} 当面临需要只针对IE7做样式的时候就可以采用这个HACK。 3、IE6及IE6以下识别 * html select {…} 这个地方要特别注意很多博客都写成了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。 4、html/**/ >bod y select {…} 这句与上一句的作用相同。 5、仅IE6不识别，屏蔽IE6 select { display /*屏蔽IE6*/:none;} 这里主要是通过CSS注释分开一个属性与值，注释在冒号前。 6、仅IE6与IE5不识别，屏蔽IE6与IE5 select/**/ { display /*IE6,IE5不识别*/:none;} 这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。不屏蔽IE5.5 7、仅IE5不识别，屏蔽IE5 select/*IE5不识别*/ {…} 这一句是在上一句中去掉了属性区的注释。只有IE5不识别，IE5.5可以识别。 8、盒模型解决方法 selct {width:IE5.x宽度; voice-family :”\”}\”"; voice-family:inherit; width:正确宽度;} 盒模型的清除方法不是通过!important来处理的。这点要明确。 9、只有Opera识别 @media all and (min-width: 0px){ select {……} } 针对Opera浏览器做单独的设定。 以上都是写CSS中的一些HACK，这些都是用来解决局部的兼容性问题，如果希望把兼容性的内容也分离出来，不妨试一下下面的几种过滤器。这些过滤器有的是写在CSS中通过过滤器导入特别的样式，也有的是写在HTML中的通过条件来链接或是导入需要的补丁样
div+css中常见的浏览器兼容性处理
在网站设计的时候，应该注意css样式兼容不同浏览器问题，特别是对完全使用DIV CSS设计的网，就应该更注意IE6 IE7 FF对CSS样式的兼容，不然，你的网乱可能出去不想出现的效果！ 所有浏览器通用 height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7、FF 共用 height: 100px !important; 一、CSS 兼容 以下两种方法几乎能解决现今所有兼容. 1, !important (不是很推荐，用下面的一种感觉最安全) 随着IE7对!important的支持, !important 方法现在只针对IE6的兼容.(注意写法.记得该声明位置需要提前.) 代码: 2, IE6/IE77对FireFox
浏览器兼容性解决方案
所有浏览器通用 height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7、FF 共用 height: 100px !important; 什么是浏览器兼容：当我们使用不同的浏览器（Firefox IE7 IE6）访问同一个网站，或者页面的时候，会出现一些不兼容的问题，在这种浏览器下显示正常，在另一种下就乱了，我们在编写CSS的时候会很恼火，刚修复了这个浏览器的问题，结果另外一个浏览器却出了新问题。好吧，我服了行吧，那我就利用你们的不兼容各写一段css,让他们各执行各的，呵呵。 一、!important (功能有限) 随着IE7对!important的支持, !important 方法现在只针对IE6的兼容.(注意写法.记得该声明位置需要提前.) 例如: #example { width: 100px !important; /* IE7+FF */ width: 200px; /* IE6 */ }
二、CSS HACK的方法(新手可以看看，高手就当路过吧) 首先需要知道的是： 所有浏览器通用 height: 100px; IE6 专用 _height: 100px; IE7 专用 *+height: 100px; IE6、IE7 共用 *height: 100px; IE7、FF 共用 height: 100px !important; 例如： #example { height:100px; } /* FF */ * html #example { height:200px; } /* IE6 */ *+html #example { height:300px; } /* IE7 */ 下面的这种方法比较简单 举几个例子： 1、IE6 - IE7+FF #example { height:100px; /* FF+IE7 */ _height:200px; /* IE6 */ } 其实这个用上面说的第一种方法也可以 #example { height:100px !important; /* FF+IE7 */ height:200px; /* IE6 */ } 2、IE6+IE7 - FF #example { height:100px; /* FF */ *height:200px; /* IE6+IE7 */ } 3、IE6+FF - IE7 #example { height:100px; /* IE6+FF */
IE不兼容完美解决方案
IE不兼容完美解决方案 2011年10月30日?编程知识?暂无评论 为什么微软IE8发布后，要求网站去做兼容了，要回答这个问题，我们就必须看看微软IE的发展历程，就不难明白其中的原因。微软的IE6是通过XP、Win2003等操作系统发布出来，作为占统治地位的桌面操作系统，也使得IE占据了统治地位，许多的网站开发的时候，就按照IE6的标准去开发，而IE6自身的标准也是微软公司内部定义的。到了IE7出来的时候，采用了微软公司内部标准以及部分W3C的标准，这个时候许多网站升级到IE7的时候，就比较痛苦，很多代码必须调整后，才能够正常的运行。而到了微软的IE8这个版本，基本上把微软内部自己定义的标准抛弃了，而全面的支持W3C的标准，由于基于对标准彻底的变化了，使得原先在早期IE8版本上能够访问的网站，在IE8中无法正常的访问，会出现一些排版错乱、文字重叠，显示不全等各种兼容性错误。这个时候就必需想办法使得旧有的网站能够兼容，保证这些网站能够得到正确的显示结果。 用户怎么办？ 作为一般的用户，在查看某个网站时候，发现当前的页面有了不兼容的情况产生时，可以鼠标轻轻的点击地址栏右边的兼容性视图切换按钮，则可以在兼容性模式下查看当前网页。如果不想这么麻烦，可以直接打开“工具”—“兼容性视图设置”对话框，把本地IE8浏览器设置为“使用兼容模式来查看所有网站”，那么这个时候你访问网站的时候，都可以在兼容模式下显示站点内容了。 网站提供商怎么办 从网站的角度看来，必需要自身做到兼容，使得那些采用IE8标准模式来查看网站的用户也能够得到正确的显示结果，通过在网站中做一些设置，使得客户查看你的网站时候，能够自动以兼容模式显示。针对以上需求，搜集了众多的解决方案，针对新手也是一种不错的解决方案，但需求根本，样式还是要符合W3C 标准的，一下方案仅供大家参考。 第一种办法，是在单个的页面中，添加兼容性标记，示例代码如下： 程序代码
浏览器不兼容处理方法
CSS对浏览器器的兼容性具有很高的价值，通常情况下IE和火狐浏览器存在很大的解析差异，这里介绍一下兼容要点。 1、DOCTYPE 影响CSS 处理 2、FF: div 设置margin-left, margin-right 为auto 时已经居中, IE 不行 3、FF: body 设置text-align 时, div 需要设置margin: auto(主要是margin-left,margin-right) 方可居中 4、FF: 设置padding 后, div 会增加height 和width, 但IE 不会, 故需要用!important 多设一个height 和width 5、FF: 支持!important, IE 则忽略, 可用!important 为FF 特别设置样式，值得注意的是，一定要将xxxx !important 这句放置在另一句之上 6、div 的垂直居中问题: vertical-align:middle; 将行距增加到和整个DIV一样高line-height:200px; 然后插入文字，就垂直居中了。缺点是要控制内容不要换行 7、cursor: pointer 可以同时在IE FF 中显示游标手指状，hand 仅IE 可以 8、FF: 链接加边框和背景色，需设置display: block, 同时设置float: left 保证不换行。参照menubar, 给a 和menubar 设置高度是为了避免底边显示错位, 若不设height, 可以在menubar 中插入一个空格。 9、在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法： div{margin:30px!important;margin:28px;} 注意这两个margin的顺序一定不能写反，据阿捷的说法!important这个属性IE不能识别，但别的浏览器可以识别。所以在IE下其实解释成这样：div{maring:30px;margin:28px} 重复定义的话按照最后一个来执行，所以不可以只写margin:XXpx!important; 10、IE5 和IE6的BOX解释不一致 IE5下div{width:300px;margin:0 10px 0 10px;} div 的宽度会被解释为300px-10px(右填充)-10px(左填充)最终div的宽度为280px，而在IE6和其他浏览器上宽度则是以300px+10px(右填充)+10px(左填充)=320px来计算的。这时我们可以做如下修改 div{width:300px! important;width /**/:340px;margin:0 10px 0 10px} 关于这个/**/是什么我也不太明白，只知道IE5和firefox都支持但IE6不支持，如果有人理解的话，请告诉我一声，谢了!：) 11、ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义ul{margin:0;padding:0;} 就能解决大部分问题 注意事项： 1、float的div一定要闭合。 例如：(其中floatA、floatB的属性已经设置为float:left;)<#div id=\”floatA\”> <#div id=\”floatB\”> <#div id=\”NOTfloatC\”> 这里的NOTfloatC并不希望继续平移，而是希望往下排。 这段代码在IE中毫无问题，问题出在FF。原因是NOTfloatC并非float标签，必须将float标签闭合。
- Javascript的IE和Firefox兼容性汇编
- 常见浏览器兼容性问题与解决技巧
- 浏览器兼容性问题解决方法
- 常见浏览器兼容性问题汇总.doc
- 最全整理浏览器兼容性问题与解决方案
- div+css中常见的浏览器兼容性处理
- 网页设计与浏览器兼容问题及解决方法
- 如何解决IE兼容性
- 前端浏览器兼容性问题及解决方法
- IE10以上浏览器兼容性问题
- WEB前端开发必备之浏览器兼容性处理方法大全
- IE浏览器和火狐浏览器兼容问题
- 最全整理浏览器兼容性问题与解决方案
- 关于各大浏览器的兼容问题解决方案大全
- 前端浏览器兼容性问题及解决方法..
- 如何处理网页兼容性问题
- 各种浏览器兼容问题列表
- 如何解决不同浏览器之间的兼容性问题
- 探讨在局域网下的OA办公系统与浏览器的兼容性问题精编版
- 最全整理浏览器兼容性问题与解决方案