浏览器兼容性的问题

1.不同浏览器默认的外补丁和内补丁不同;

       *{margin: 0;padding: 0;}

2.同时使用margin和float时,IE6下的双倍边距bug如何解决?

     (1).给float元素添加display: inline;

      (2)将margin替换成padding

3.IE6下因为默认行高无法定义1px左右的容器

      overflow: hidden;   zoom:  0.08; line-height: 1px;  font-size: 0;

4.有些浏览器下img有空隙(原因:回车)

        让图片浮动

5.opacticy

     filter: alpha(opacity = 80)   //IE

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

css hack:

说明:在标准模式中

“-″减号是IE6专有的hack

“\9″ IE6/IE7/IE8/IE9/IE10都生效

“\0″ IE8/IE9/IE10都生效,是IE8/9/10的hack

“\9\0″ 只对IE9/IE10生效,是IE9/10的hack


关于IE&&Firefox之间的区别:

innerText                                       IE 支持         FF 不支持(使用textContent)

document.createElement             IE支持(仅IE支持传递字符串作为参数)     FF支持

setAttribute()                                 IE不支持      FF支持



FF浏览器不支持innerText  , outerHTML  , outerText

innerText最初是由 IE4.0 浏览器实现的私有属性,它描述的是元素的内容

outerHTML最初是由 IE浏览器实现的私有属性,W3C 的 HTML5 规范草案中也新加入了这个属性,它描述的是元素本身以及它的内容。

outerText最初是由 IE4.0 浏览器实现的私有属性,它描述的是元素的内容。



(1)IE 各版本中可以通过 "Element.PropertyName" 访问 HTML 元素的自定义属性;

(2)IE 各版本中可以通过 "Element.getAttribute("value")" 及 "Element.setAttribute("value", "XXX")" 获取和设置 INPUT 文本框的实时输入的值(即 HTMLInputElement 对象的 value 属性,也叫做 current value);

(3)IE6 IE7 IE8(Q) 中无法通过 "Element.setAttribute("class", "AttributeValue")" 设置元素的 class 属性,而需要使用 "Element.setAttribute("className", "AttributeValue")";

(4)IE6 IE7 IE8(Q) 中无法通过 "Element.setAttribute("style", "AttributeValue")" 设置元素的 style 属性,通过 "Element.getAttribute("style")" 得到的不是元素的 style 属性的字符串值,而是一个对象;

(4)IE6 IE7 IE8(Q) 中无法通过诸如 "Element.setAttribute("onclick", "alert('ok')")" 为元素绑定事件;

(5)IE6 IE7 IE8(Q) 中可以通过诸如 "Element.getAttribute("offsetHeight")" 的方式获得元素的一些 DOM 属性的值,也可以通过诸如 "Element.setAttibute("innerHTML", "AttributeValue")" 的方式设置元素的一些非只读 DOM 属性的值。

(6)E并不是不支持setAttribute这个函数,而是不支持用setAttribute设置某些属性,例如对象属性、集合属性、事件属性,也就是说用setAttribute设置style和onclick这些属性在IE中是行不通的。为达到兼容各种浏览器的效果,可以用点符号法来设置Element的对象属性、集合属性和事件属性。

你可能感兴趣的:(浏览器兼容性的问题)