浏览器兼容问题(QQ浏览器兼容模式怎么设置)

常见的浏览器兼容性问题有哪些？前端工程师是怎么解决的？浏览器兼容性又称网页兼容性或网站兼容性，是指网页在各种浏览器上的显示效果不一致而导致的浏览器与网页之间的兼容性。一个专业的Web前端工程师必须能够处理浏览器兼容性问题。接下来，边肖将与您分享常见的浏览器兼容性问题。

1.设置较小的高度标签，标签的高度超过了IE6、IE7和漫游中设置的高度。

解决方法:为超过高度的标签设置溢出:隐藏；或者将行高的行高设置为小于您设置的高度。

2.不同浏览器的默认外部补丁和内部补丁是不同的，

解决方案:*在CSS中。

3.块属性标签浮动后，如果有水平边距，IE6显示边距大于设定边距。

解决方案:在float的标签样式控件中添加display:inline；将其转换为内联属性。

4.标签最小高度的最小高度设置不兼容。

解决方案:如果我们要将一个标签的最小高度设置为200px，那么需要的设置是:{ min-height:200 px；身高:自动！重要；高度:200px溢出:可见；}

5.内联属性标签，设置display:block后，采用float的布局，存在水平边距的情况，是IE6间距bug。

解决方法:显示:遮挡；添加显示:在后面内嵌；显示:表格.

6.求解IE6最大最小宽度和高度的hack方法

/*最小宽度*/。min _ width { min-width:300 px；_ width:expression(parse int(this . client width)& lt；300 ?" 300 px ":this . client width)；}/*最大宽度*/。max _ width { max-width:600像素；_ width:expression(parse int(this . client width)& gt；600 ?" 600 px ":this . client width)；}/*最小高度*/。min _ height { min-height:200 px；_ height:expression(parse int(this . client height)& lt；200 ?" 200px ":this . client height)；}/*最大高度*/。max _ height { max-height:400 px；_ height:expression(parse int(this . client height)& gt；400 ?" 400 px ":this . client height)；}

7.z-index不工作的bug

1)在1)IE6下，先说第一个z-index不管设置多高都不起作用的情况。发生这种情况有三个条件:1。父标签位置属性是相对的；2.问题标签包含float属性。

2)所有浏览器:当父标签的位置属性为相对或绝对时，子标签的绝对属性相对于父标签。但在IE6下，层级的表现有时并不取决于子标签的z-index有多高，而是取决于其父标签的z-index中谁高谁低。

8.其他兼容技能

1)在1)FF下为div设置padding会导致宽度和高度增加，而IE不会。(可用！重要解决方案)

2)对中问题。

垂直居中。将line-height设置为与当前div相同的高度，然后传递vetical-align: middle。(注意不要绕线。)

水平居中。边距:0自动；

3)如果要给A标签中的内容添加样式，需要设置display:block；(在导航选项卡中常见)

4)4)FF和ie对BOX理解的不同导致了2px的不同，IE下div的双边距设置为float。

5)ul标签在FF下默认具有列表样式和填充。最好提前申报，避免不必要的麻烦。(在导航选项卡和内容列表中常见)

6)div作为一个外部包装器，不要固定高度，最好加上overflow: hidden，实现高度自适应。

7)关于手光标光标:指针，而手只适用于IE。