From dd7ef3ec514fc9453e7159c53c35f69f9a2fdfd0 Mon Sep 17 00:00:00 2001 From: LeuisKen Date: Thu, 30 Jul 2015 18:15:44 +0800 Subject: [PATCH] fix IE7 --- _posts/2015-01-06-fuckIE.html | 46 ++++++++++++++++++++++++++++++++--- 1 file changed, 42 insertions(+), 4 deletions(-) diff --git a/_posts/2015-01-06-fuckIE.html b/_posts/2015-01-06-fuckIE.html index 0c975e1..8091894 100644 --- a/_posts/2015-01-06-fuckIE.html +++ b/_posts/2015-01-06-fuckIE.html @@ -2,8 +2,46 @@ layout: post category: "frontend" tag: [前端] -title: 于是也是遇上了奇葩的IE问题 +title: 处理IE7兼容的一些经验 --- -

终于有一天写东西碰到IE7了，虽然只是一个简单的展示页，但已经让我知道的IE的傲娇，哭笑不得。

-

于是，img默认有了border，就得加了个border:0;。overflow:hidden;不起作用，你得给那个元素加个position:relative;。傲娇如你，怎么做朋友。

-

话说回来，现在看到有人在说dw总想去教他做人，我也是快没朋友了。唉，遭重啊。

\ No newline at end of file +

当页面需要兼容IE7的时候，就总会有一些让人很无奈很头疼的问题，在此就总结一些IE7兼容方面的经验。

+

其实，做pc端的页面，最重要的，是要有一个好的clearfix。之前用的clearfix兼容IE7但不兼容IE8，结果在IE7下调好页面，一开页面到IE8吓尿了。于是找的了一个好的clearfix，如下：

+
+	/* clearfix */
+	.clearfix:after{
+		content:".";
+		display:block;
+		height:0;
+		clear:both;
+		visibility:hidden
+	}
+	.clearfix{*+height:1%;}
+
+ +

另外一个问题就是不支持before和after伪元素，需要用js处理一下，解决方案传送门：小tip:我是如何在实际项目中使用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 = document.createElement("after");
+      
+    // 内部content
+    before.innerHTML = content;
+    after.innerHTML = content;
+    // 前后分别插入节点
+    dom.insertBefore(before, dom.firstChild);
+    dom.appendChild(after);
+};
+
+

顺带一提，在IE8下，虽然支持伪元素，但是不支持a::before的写法，要用一个冒号的写法才会起作用。

+

接下来是一些小问题和经验的总结：

+
    +
  1. 被包着的a标签，是不会继承父级标签的color的，你给a的color设为inherit也不行；
    2. +
  2. img默认有了border，加上border:0；
    3. +
  3. overflow:hidden;需要position:relative;的配合才能起作用；
    4. +
  4. position:absolute下left:auto;的默认表现不太一样，不会和前面的元素重叠，要想和别的一样得加一个left:0;；
    5. +
  5. 肯定没完，慢慢更新。
    6. +
\ No newline at end of file