浏览器的一些兼容问题

1. ie6.0横向margin加倍

产生因素:块属性、float、有横向margin。

解决方法:display:inline;

2. ie6.0下默认有行高

解决方法:overflow:hidden;或font-size:0;或line-height:xx px;

3. 在各个浏览器下img有空隙(原因是:回车。)

解决方法:让图片浮动。

4. 一个父标签与几个子标签嵌套,父标签不浮动,子标签float,子标签不撑开父的高度。

解决方法:a 在子标签最后清浮动{<div style="height:0;clear:both;">&nbsp;</div>}

b 父标签添加{overflow:hidden;}

c 给父标签设置高度

5. Ie6下,不识别最大宽、高度和最小宽高度,意即min-width/height和 Max-width/height在ie6中没效果

解决方法:(1):.abc{border:1px blue solid;width:200px;height:200px;}

html>body .abc{width:auto;height:auto;min-width:200px;min-height:200px;}

(2):.abc{width:200px;height:200px;_width:200px;_height:200px;}(因为ie6有一个特征,当定义一个高度时,如果内容超过高度,元素会自动调整高度。)

6. Ie6里面:如li设宽、高,并且li里面的标签浮动,那么li之间会有间距

解决方法:li不设宽、高或者li内的标签不浮动

7.  li之间有间距

解决方法:li 设置vertical-align:middle;

8. 3像素问题:ie6下,当浮动元素与流动元素并列显示时,他们之间会存在三像素问题。

解决方法:用hack技术, 例如:所有浏览器通用 height:100px;

ie6专用_height:100px;

ie7专用*+height:100px;

ie6/ie7共用*height:100px;

9. 当多个浮动元素中间夹杂着HTML注释语句时,如果浮动元素宽度为100%,则在下一行多显示一个上一行最后一个字符。

解决办法:给浮动元素添加display:inline;。

10. opacity 定义元素的不透明度

filter:alpha(opacity=80);/*ie支持该属性*/

opacity:0.8;/*支持css3的浏览器*/

11. 两个块元素,竖向的margin值不增加,会重叠,其间距为最大margin值。

12. 优先级:被!important 注明的css属性具有最高优先级(.abc{color:red !important;})。但在ie6中!important具有一个bug:在同一组css属性中,!important不起作用。

时间: 2024-11-03 20:49:56

浏览器的一些兼容问题的相关文章

js 判断浏览器关闭事件 兼容所有浏览器

无论是从页签处关闭浏览器,还是关闭整个浏览器窗口,无论是 ie11,火狐,谷歌,苹果,还是ie6,都能兼容的浏览器关闭事件监听 在网上搜索了一天,虽然网上也有之类的代码,但是太繁琐,有时候还不可用.我也是在原有基础上修改的.经过了上述的浏览器测试,如果有不兼容的,欢迎提出意见一起学习. ? <script type="text/jscript" src="jquery-1.10.2.min.js"></script> <script t

用条件注释判断浏览器版本,解决兼容问题

对于浏览器兼容问题,我们应该碰到很多了,在平时写一些页面时,在IE8.IE9上可能好好的,当我们在IE6.IE7或者是其他的浏览器上再浏览这些页面时,可能会发现我们的页面已经面目全非了,作为一名前端开发人员,这是最让人发疯的问题了,那么我们该怎么解决这些问题呢? 首先,我们写的页面在不同的浏览器上之所以会出现表现不同的问题,是因为不同的浏览器在解析页面时,他们所遵循的规则并不是完全相同的.比如IE,不同的版本解析都不同,何况是不同的浏览器厂商,不同的内核呢.但是我们在遇到兼容性问题时,应该首先检

【转】360浏览器极速与兼容模式的解释

对于360浏览器的极速模式与兼容模式,相信大家都不陌生,极速代表着高速,意味着是高版本的浏览器,速度快嘛.而兼容模式则是极力适合各种浏览器,考虑更多的是兼容. 这两个模式在360浏览器上怎么设置呢? 打开浏览器,在网址的后面有一个闪电的图标或是一个e图标,闪电是指您目前使用的是极速浏览器,而e则代表是兼容模式.两者可以自由切换,切换的方法很简单,直接点击这个图标,有下拉,点击选择就是了. 今天我们对于360浏览器极速与兼容模式有新的解释,是从版本这个角度来看的. 使用极速,就类似用了360的高速

css在各浏览器中的兼容问题

CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并 整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名. CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容

ASP.NET服务器控件在IE10浏览器(非兼容模式)下报脚本错误的可能解决办法

关于IE10出现LinkButton点击无效的情况:        一般高配置的系统如Win7旗舰版SP1系统不会出现这种情况,针对家庭普通版和专业版的用户通过测试都有这种情况,对于开发人员要解决不同系统和IE的兼容问题一时有点摸不着头脑,可能微软发布IE10正式版本不久,兼容问题没有考虑周全,或者微软目的是指引用户向着高版本看齐最终目的推销win8,不管怎样,解决方法才是王道:       网上资料显示这种情况是ASP.NET无法检测IE10,导致_doPostBack未定义JavaScrip

各个浏览器之间的兼容问题

各个浏览器之间的兼容性问题,同样的HTML5和CSS5样式,但是浏览器表现的效果不一样.一,什么兼容性问题,不正常的原因是什么?,应该怎么样让浏览器显示正常.二,为什么浏览器会存在兼容性的问题?1,同一个浏览器,版本越老存在的bug越多,越新的版本,对新标签和新的属性,新的特性支持越少.2,不同的浏览器,核心技术不一样,标准不同,实现的方式也有差异,最终的效果也有差异.三,处理兼容性问题的思路one,要不要做?1,从产品的角度,(产品的受欢迎程度,受欢迎浏览器的比例,效果优先还是基本功能优先?)

如何将IE浏览器设置为兼容模式

如何将IE浏览器设置为兼容模式打开IE浏览器,进入任意页面点击"工具"选项,会跳出一个下拉菜单,选择"兼容性视图设置"选项.进入兼容性视图设置之后,填入你所需要设置兼容模式的网址,点击添加,勾上:在兼容性视图中显示所有网站,最后点击关闭即可. 原文地址:https://blog.51cto.com/chentongsan/2459468

常见的IE浏览器的一些兼容问题及解决方法

浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率:100% 解决方案:CSS里    *{margin:0;padding:0;} 备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0. 浏览器兼容问题二:块属性标签float后,又有横行的margin情况下,在IE6显示margin比设置的大 问题症状:常见症状

解决html5新标签 placeholder 低版本浏览器下不兼容问题

placeholder属性是HTML5 中为input添加的.在input上提供一个占位符,文字形式展示输入字段预期值的提示信息(hint),该字段会在输入为空时显示. 实例:1 <input type="text" name="userName" placeholder="请输入用户名"> placeholder操作起来非常方便,提高了开发效率,同时在高版本浏览器中用户体验也很好,所以本人很喜欢用这个属性. 然而,在IE9以下版本浏

selenium框架与chrome浏览器的不兼容问题

在一次偶然的情况下,在chrome上用selenium框架去抓取某个id为XX的页面元素,使用WebDriver的findElement().click()方法进行点击,原来在firefox浏览器运行得好好的程序报错了.编译器给报了InvocationTargetException,有点经验的coder都知道,这个异常范围太广了,并且最蛋疼的是不给出任何异常信息(StacktraceInformation为null)这时候就不得不用getCause方法来得到导致其出现的真正异常,并且得到异常信息