关于ie6出现的问题的原因归结
关于ie6出现的问题主要可以归结为以下几种情况把。
当然还存在各种原因,bug的情况也还有各种各样,我只是小结一下我自己经常遇到,比较有代表性的问题。会持续的更新。
1。浏览器本身存在的缺陷
比如:
1》左浮动的元素,加了左补白(margin-left),就会出现双倍边距的问题。(我们可以尽量去避免这些问题,在不影响结构和其他样式的情况下,可以用左边距(padding-left),虽然两者在语意上是有区别的。)
2》绝对定位元素的1像素间距bug,当绝对定位元素的父元素高或宽为奇数时,bottom和right会产生错误,唯一的解决办法就是给父元素定义明确的高宽值,但对于液态布局没有完美的解决方法。(我的解决方法是针对ie6写了一个:_bottom:-1px;)
2。与标准的不同(触发布局的方式和其他浏览器不同)
比如:
浮动的清除(关闭)
1.Overflow :
hidden;
2.设置高宽
3.clear:both;
4.Zoom:1;
5.还有专门的浮动清除的类:
.clearfix:after
{content:"\200B"; display:block; height:0; clear:both; }
.clearfix
{ *zoom:1; }.
这是因为在ie中触发布局的方式和其他浏览器不同。所以有时候在代码中加zoom:1;是非常有用的。
3。不支持一些元素或者方法(这些元素或者方法出现在ie6出现之后)
比如:
1.透明读属性opacity。在ie6,7,8中都是无效的,我们可以用filter来代替:opacity: 0.5; filter:alpha(opacity=50);但是考虑到性能问题,也可以直接不考虑低级版本浏览器。
2.如果是png图片透明问题的话可以加一个滤镜的插件(可以到网上搜一下具体用法):
<!--[if IE 6]>
<script type="text/javascript"
src="/js/DD_belatedPNG-min.js"></script>
<script>
DD_belatedPNG.fix("#foot_logo,img,background");
</script>
<![endif]-->
3. css3中的一些样式效果,比如圆角,阴影之类的都是用渐进增强,平稳退化的原则。
4. JSON.stringify方法ie6.7是不支持的。如果要考虑ie6.7需要用其他方法。
关于ie6出现的问题的原因归结的更多相关文章
- 关于ie6/7下的z-index
z-index这个属性其实在挺多地方都会用到,在百度上搜索也有大量关于z-index的篇幅去阐述这个属性,特别是在ie6下的z-index处理有更多的相关文章,本文就不再围绕z-index这一属性的基 ...
- IE6中常见兼容性问题及浏览器显示难题
1.双倍边距Bug 问题描述:假如有一个ul,里面有若干li,当li设置为左浮动时,此时设置li的margin-left为10px,会在最左侧呈现双倍情况.即20px 正常显示: IE6显示: 修正方 ...
- 关于form.submit()不能提交表单的错误原因
来源:http://www.ido321.com/948.html 直接上代码把: 1: <div id="register"> 2: <h4>会员注冊&l ...
- z-index兼容问题:关于ie6/7下的z-index
z-index这个属性其实在挺多地方都会用到,在百度上搜索也有大量关于z-index的篇幅去阐述这个属性,特别是在ie6下的z-index处理有更多的相关文章,本文就不再围绕z-index这一属性的基 ...
- [原创]ie6,7中td和img之间有间隙
情形描述 开发工具:VS2010: 浏览器版本:IE6以上,火狐,谷歌: 页面布局设计:Table+Img布局: 项目预览问题:火狐,谷歌,IE8以上未出现问题,IE6,IE7图片之间有间隙. 分析原 ...
- IE6下面的浮动问题
第一个问题: 在IE6下面overflow:hidden;失效 原因:在IE6/7中子级设置position:relative;属性值后,导致父级的overflow:hidden;失效. ...
- ie6浏览器兼容性
1.ie6双倍边距bug 块状元素设置float(左浮动或有浮动),并且设置margin值之后,第一个浮动的元素其左侧margin值为正常的2倍,如图,可以看到第一个元素的左侧边距于其他元素两两之间的 ...
- [CSS Hack]解決IE6、IE7、IE8、Firefox的瀏覽器相容性問題!
每次調CSS最令人頭痛的就是瀏覽器校正問題,因為每個瀏覽器對CSS的解釋都不太一樣,Firefox本身算是比較照規矩來,處理上比較簡單,但是遇到微軟的IE系列頭就大了,雖然都是IE,但是IE6.IE7 ...
- 【Web】[原创]ie6,7中td和img之间有间隙
情形描述 开发工具:VS2010: 浏览器版本:IE6以上,火狐,谷歌: 页面布局设计:Table+Img布局: 项目预览问题:火狐,谷歌,IE8以上未出现问题,IE6,IE7图片之间有间隙. 分析原 ...
随机推荐
- maven学习一(HelloWorld工程)
maven是一个出色的java工程依赖管理的工具,刚刚开始学习用maven建立一个HelloWorld工程. maven安装 $ wget http://mirrors.cnnic.cn/apache ...
- Android批量图片加载经典系列——使用xutil框架缓存、异步加载网络图片
一.问题描述 为提高图片加载的效率,需要对图片的采用缓存和异步加载策略,编码相对比较复杂,实际上有一些优秀的框架提供了解决方案,比如近期在git上比较活跃的xutil框架 Xutil框架提供了四大模块 ...
- 程序日志--ios“考反应扑克游戏”程序
交代一下我做程序的工具:mac os x虚拟机10.9.3 Xcode6 百度^-^ 參考书iPhone30天精通 总结与经验,还有遇到的问题,都在程序 ...
- Spark2.3(三十五)Spark Structured Streaming源代码剖析(从CSDN和Github中看到别人分析的源代码的文章值得收藏)
从CSDN中读取到关于spark structured streaming源代码分析不错的几篇文章 spark源码分析--事件总线LiveListenerBus spark事件总线的核心是LiveLi ...
- 小度WiFi
这个东西真不错,详情查看: http://wifi.baidu.com 是在京东上抢购的,但是那次抢购体验做得很次:首先,只能预约一种颜色;其次,第一天抢购了,第2天就不能抢购了;第三,等抢购完了,如 ...
- 《Attention is All You Need》
https://www.jianshu.com/p/25fc600de9fb 谷歌最近的一篇BERT取得了卓越的效果,为了研究BERT的论文,我先找出了<Attention is All You ...
- CCNA实验3.单臂路由器
拓扑图: 一.交换机配置 通过路由器子接口的方式实现vlan之间的路由. conf t vlan 10 vlan 20 int f0/1 switchport access vlan 10 int f ...
- python module install
1.issue: How can I bypass kivy module error: ImportError: DLL load failed: The specified module coul ...
- 启用phpstorm代码提示功能
参考:http://www.dawnfly.cn/article-1-331.html mac下实际上将省电禁用即可
- html中<a>标签的种类
在html中a 标签是一个链接标签,然而a 标签也有非常多的种类,在此做一个小结. 一.普通链接 <a href="http://www.baidu.com">百度&l ...