html常见兼容性问题

html常见兼容性问题?

1.双边距BUG float引起的  使用display

2.3像素问题 使用float引起的 使用dislpay:inline -3px

3.超链接hover 点击后失效  使用正确的书写顺序 link visited hover active

4.IE z-index问题 给父级添加position:relative

5.Png 透明 使用js代码 改

6.Min-height 最小高度 !Important 解决’

7.select 在ie6下遮盖 使用iframe嵌套

8.为什么没有办法定义1px左右的宽度容器(IE6默认的行高造成的,使用over:hidden,zoom:0.08 line-height:1px)

9.IE5-8不支持opacity,解决办法:

.opacity {

opacity: 0.4

filter: alpha(opacity=60); /* for IE5-7 */

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* for IE 8*/

}

10. IE6不支持PNG透明背景,解决办法: IE6下使用gif图片

时间: 2024-10-21 14:47:37

html常见兼容性问题的相关文章

IE下常见兼容性问题总结

概述 本小菜平时主要写后台程序,偶尔也会去写点前端页面,写html.css.js的时候,会同时开着ie6.ie7.ie8.ie9.chrome.firefox等浏览器进行页面测试,和大部分前端开发一样,经常被ie折磨,下面就总结一些常见的浏览器兼容性问题,放一起方便自己总结学习,我知道这类型文章,很多大牛都总结过,且写的特别专业.不过我写的都是自己最近碰到的,本人技术一般,也希望各位多加指点. 一.IE6/IE7对display:inline-block的支持欠缺 1)表现描述 这个应该算是很经

CSS常见兼容性问题总结

你想要执行的代码 你想要执行的代码 浏览器的兼容性问题,通常是因为不同的浏览器对同一段代码有不同的解析,造成页面显示不统一的情况. 这里谈到的浏览器,主要指IE6/IE7/IE... FireFox Chrome Opera Safari 等. 但更多的兼容还是考虑IE6/IE7/FF之间的斗争 先来谈谈CSS Hack 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样式,所以我们就把这个针对不同浏览器/版本而写CSS的过程叫做 CSS hack. CSS ha

ie6的常见兼容性问题

(一):选择器的兼容问题 1.对于一般的选择器如id选择器.类选择器.标签选择器,IE6和其他浏览器一样都兼容: 2.子代选择器(E>F),序选择器(E:first-child.E:last-child).兄弟选择器(E+p)这些选择器IE6都不兼容{主要是css2中的选择器,css3中的先不谈} (二):双倍margin问题 1.何为双倍的margin? 解释:就是说当我们连续浮动元素时,如果浮动元素的浮动方向和我们设置的margin方向相同时,浮动元素的第一个元素就会具有双倍的margin值

JS常见兼容性问题

兼容性问题:函数(方法)兼容 描述:部分W3C指定的函数,有部分老的浏览器不支持 解决: 条件判断,如果有,则使用,添加原型方法,例如 String 的 trim 方法 if(!String.prototype.trim){ String.prototype.trim = function(){ return this.replace(/^\s\s*/,'').replace(/\s\s*$/,'') } } 兼容性问题:浏览器视口.屏幕.页面宽高获取 解决: 1. 获得当前页面 HTML文档所

常见兼容性问题?

1.png24位的图片在iE6浏览器上出现背景,解决方案是做成PNG8.也可以引用一段脚本处理. 2.浏览器默认的margin和padding不同.解决方案是加一个全局的*{margin:0;padding:0;}来统一. 3.IE6双边距bug:块属性标签float后,又有横行的margin情况下,在ie6显示margin比设置的大. 浮动ie产生的双倍距离(IE6双边距问题:在IE6下,如果对元素设置了浮动,同时又设置了margin-left或margin-right,margin值会加倍.

移动端常见兼容性问题及解决办法

当使用transform:translate3d(-50%,-50%,0)居中弹框(div)时,在pc端,内部的文字会模糊.解决办法:给body定义样式 body{ font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif; } 用position:absolute/fixed;把一个按钮固定在页面的底部,在android系统中,当调用输入法时,该按钮会

IE6下CSS常见兼容性问题及解决方案

1. 在IE6元素浮动,如果宽度需要内容撑开,就给里面的块元素加浮动. 2. IE6下最小高度问题:在IE6下元素高度小于19px的时候,会被当作19px处理.解决方案:给元素加 overflow:hidden. 3. border:1px dotted #000: 1px dotted 在IE6下不支持 解决方案:切背景平铺 4. margin传递:解决方案:a.父级或自己浮动; b.给元素加 overflow:hidden;zoom:1; 5. 在IE6下父级有边框的时候,子元素的margi

html常见兼容性问题?

1.双边距BUG float引起的  使用display 2.3像素问题 使用float引起的 使用dislpay:inline -3px 3.超链接hover 点击后失效  使用正确的书写顺序 link visited hover active 4.IE z-index问题 给父级添加position:relative 5.Png 透明 使用js代码 改 6.Min-height 最小高度 !Important 解决' 7.select 在ie6下遮盖 使用iframe嵌套 8.为什么没有办法

干货!前端常见兼容性问题

各大浏览器兼容问题 1. HTML对象获取问题 FireFox:document.getElementById("idName"); ie:document.idname或者document.getElementById("idName"). 解决办法:统一使用document.getElementById("idName"); 2. const问题 说明:Firefox下,可以使用const关键字或var关键字来定义常量; IE下,只能使用va