浏览器兼容性问题

╰半橙微兮° 2022-03-27 09:12 456阅读 0赞

一、常见兼容性问题  
1.双倍浮动bug  
描述：块元素设置了float后，又设置了横向的margin值，在IE6下显示的margin值比设置的值要大，并且是2倍关系.  
解决方案：给浮动的块元素添加display:inline;

2.表单元素行高不一致  
解决方案：给表单元素添加float或vertical-align:middle;

3.在IE6中不能识别**较小**高度的容器（一般为小于18px）;  
注：较小不是最小  
解决方案：给元素添加overflow:hidden;

4.在IE6中不能识别min-height属性  
解决方案：a) min-height:100px; \_height:100px;  
b)min-height:100px; height: auto !important: height:100%;

5.a标签里嵌套img标签时，有些浏览器(IE浏览器)不会出现有颜色的边框  
解决方案：img\{border:none;\}或img\{border:0;\}

6.图片默认有间隙  
解决方案：img\{float:left;\}或img\{display:block;\}

7.在IE8及以下浏览器中不能识别opacity属性  
解决方案：filter:alpha(opacity=数值）取值范围：0-100；

8.鼠标指针bug  
描述：cursor:hand;在IE8及以下浏览器支持，其它浏览器不支持  
解决方案：cursor:pointer;  
将鼠标指针的形状设置为手型，所有浏览器都支持

9.百分比bug  
描述：在IE6下，百分之五十加百分之五十四舍五入大于百分之百  
解决方案：给右边浮动的元素设置clear:right;

10.上下margin重叠问题  
描述：给上面和下面的元素同时设置了margin-bottom和margin-top;只能识别其中较大的值.  
解决方案：a)margin:top和margin:bottom;只设置其中一个值；  
b)给其中一个元素外层嵌套一个盒子，并设置overflow:hidden;触发BFC，给里面的元素创建一个块级格式上下文

11.假传圣旨  
描述：给子元素设置的margin值运用在了父元素上  
解决方案：a)把给子元素设置的margin值改为给父元素设置padding  
b)给父元素设置overflow:hidden;或float:left;触发BFC；  
c)给父元素设置透明边框，即 border-top:1px solid transparent;

发表评论取消回复

表情：

评论列表（有 0 条评论，456人围观）

还没有评论，来说两句吧...

相关阅读

相关浏览器兼容性问题

[https://www.caniuse.com/][https_www.caniuse.com] 测试某个API，在不同浏览器的兼容程度 ![在这里插入图片描述][2

比眉伴天荒/ 2023年07月06日 11:52/ 0 赞/ 80 阅读

相关谈谈浏览器兼容性问题

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] 为什么浏览器会存在兼容问题？同一浏览器，版

深碍√TFBOYSˉ_/ 2022年10月02日 00:49/ 0 赞/ 263 阅读

相关浏览器之兼容性问题

兼容性问题的由来 2001年微软发布了XP和IE6，在当时是世界上标准执行得最高的浏览器，并且有很多私有技术和容错技术，使得顶峰市场份额达到98%。于是骄傲的微软不理睬W3C

今天药忘吃喽~/ 2022年07月12日 02:14/ 0 赞/ 347 阅读

相关关于浏览器兼容性问题

摘至本人有道云笔记《关于浏览器兼容性问题》今天在写python--web服务器的时候遇到一个浏览器兼容问题写响应头时 a='HTTP/1.1 20

忘是亡心i/ 2022年05月09日 02:34/ 0 赞/ 333 阅读

相关 safari浏览器兼容性问题

今天写代码遇到的一个bug，在chrome上显示得好好的时间，一到Safari就提示 “invalid date”，于是回来看代码（为了一目了然，进行一些处理）： v

亦凉/ 2022年04月13日 11:39/ 0 赞/ 439 阅读

相关浏览器的兼容性问题

浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。解决方案：CSS

r囧r小猫/ 2022年04月11日 08:41/ 0 赞/ 390 阅读

相关浏览器兼容性问题

一、常见兼容性问题 1.双倍浮动bug 描述：块元素设置了float后，又设置了横向的margin值，在IE6下显示的margin值比设置的值要大，并且是2倍关系.

╰半橙微兮°/ 2022年03月27日 09:12/ 0 赞/ 457 阅读

相关浏览器兼容性问题

1，浏览器兼容问题一：不同浏览器的标签默认的margin和padding不同问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大

- 日理万妓/ 2021年08月29日 22:17/ 0 赞/ 597 阅读

相关 js 浏览器兼容性问题

0、js原生对象获取自定义属性值的问题： <input type="text" id="test" test="abc" /> 在IE下，发现使用$("\te

电玩女神/ 2021年06月24日 13:58/ 0 赞/ 669 阅读

相关浏览器的兼容性问题

一：css兼容性问题　　1：通常我们写代码在css开始的时候就会写　　　　*{ 　　　　　　margin:0; 　　　　　　padding:0; 　　　　　...

小灰灰/ 2021年01月12日 00:32/ 1 赞/ 864 阅读