怎么写代码兼容ie6( 三 ) _兼容

【怎么写代码兼容ie6】5.区别IE7、Firefox 【区别符号】：「*」、「！important」【示例】：#divcss5{ background:blue; /*Firefox 背景变蓝色*/*background:green !important; /*IE7 背景变绿色*/ } 【说明】：因为Firefox可以辨识「！important」但却无法辨识「*」，而IE7则可以同时看懂「*」、「！important」，因此可以两个辨识符号来区隔IE7和Firefox 。6.区别IE6、IE7 (EXP 1) 【区别符号】：「*」、「_」【示例】：#tip {*background:black; /*IE7 背景变黑色*/ _background:orange; /*IE6 背景变橘色*/ } 【说明】：IE7和IE6都可以辨识「*」（米字号），但IE6可以辨识「_」（底线），IE7却无法辨识，透过IE7无法读取「_」的特性就能轻松区隔IE6和IE7之间的差异。
7.区别IE6、IE7 (EXP 2) 【区别符号】：「！important」【示例】：#divcss5{ background:black !important; /*IE7 背景变黑色*/ background:orange; /*IE6 背景变橘色*/ } 【说明】：因为IE7可读取「！important；」但IE6却不行，而CSS的读取步骤是从上到下，因此IE6读取时因无法辨识「！important」而直接跳到下一行读取CSS，所以背景色会呈现橘色。8.区别IE6、Firefox 【区别符号】：「_」【示例】：#divcss5{ background:black; /*Firefox 背景变黑色*/ _background:orange; /*IE6 背景变橘色*/ } 【说明】：因为IE6可以辨识「_」（底线），但是Firefox却不行，因此可以透过这样的差异来区隔Firefox和IE6，有效达成CSS hack 。
以上包括了IE6\IE8\IE7\火狐浏览器兼容问题及解决方法。
4.css before兼容IE6/7如何写1.CSS部分
类似这样子的命名：
复制代码代码如下：
.example:before, .example before {}
.example:after, .example after {}
一个有冒号，一个是空格分隔。前者IE8+及其他现代浏览器；后者为IE6-7准备的。
2.HTML部分
如果before/after伪类元素含有content内容（不是空字符），则content内容在HTML标签上呈现（方便IE6/7下获取），例如：
复制代码代码如下：
CSS部分的content属性值应该如下：
复制代码代码如下：
.example:before, .example before { content: attr(data-content);。}
.example:after, .example after { content: attr(data-content);。}
3.JS部分
JS是为IE6/7准备的，所做的事情很简单，网元素内部插入两个元素，标签名为”before“或”after“或同时。方法代码如下：
复制代码代码如下：
var $beforeAfter = function(dom) {
if (document.querySelector || !dom && dom.nodeType !== 1) return;
var content = dom.getAttribute("data-content") || '';
var before = document.createElement("before") //可以根据需要把after或before删除一个
, after = document.createElement("after")； //默认会把两个都加上
// 内部content
before.innerHTML = content;
after.innerHTML = content;
// 前后分别插入节点
dom.insertBefore(before, dom.firstChild);
dom.appendChild(after);
};
4.调用
$beforeAfter(document.getElementById("tip")); //tip是需要的id名

文章插图