:after和:before css伪元素hack for IE 7
:after和:before css伪元素hack for IE 7
提问于 2010-11-15 14:14:01
我正在使用:after和:before css伪元素，它在IE8和所有现代浏览器中都工作得很好，但在IE7中却不能很好地工作。在IE7中是否有解决此问题的已知黑客方法
回答 6
Stack Overflow用户
回答已采纳
发布于 2010-11-15 14:16:41
对于任何纯粹的CSS黑客来说，这都是不可能的。
使用IE8.js http://code.google.com/p/ie7-js/
它支持这一点。http://ie7-js.googlecode.com/svn/test/index.html
测试页面也在那里
after - http://ie7-js.googlecode.com/svn/test/after.html
之前- http://ie7-js.googlecode.com/svn/test/before.html
在第一条评论后编辑
你可以把这个js保存在IE6和7中。其他浏览器不会读到它。
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->如果你已经在项目中使用了jQuery，那么你可以使用这个插件
jQuery伪插件
Stack Overflow用户
发布于 2012-02-21 06:08:26
我在一个项目中使用IE8.js (http://code.google.com/p/ie7-js/)，我不得不删除它，因为它在10/15秒之间阻塞了IE7。
为了管理使用:after和:生成的内容，在伪元素之前，不使用IE8.js，我执行了以下操作：
.tabs {
*zoom: expression(
this.runtimeStyle.zoom="1",
this.appendChild( document.createElement("small") ).className="after"
);
}
.tabs:after,
.tabs .after {
content: '';
display:block;
height:10px;
width:100%;
background:red;
}我更喜欢这种方式，而不是使用javascript，因为这将使所有选择器保持在相同的位置:)
Stack Overflow用户
发布于 2013-07-30 22:30:58
对于之前和之后，您可以使用此命令：
.tabs {
*zoom: expression(
this.runtimeStyle.zoom="1",
this.insertBefore(
document.createElement("div"),
this.childNodes[0]
).className="before",
this.appendChild(
document.createElement("div")
).className="after"
);
}
...
.tabs::before, .tabs .before {
display: block;
width: 10px;
height: 20px;
background-color: #eee;
float: left;
}
.tabs::after, .tabs .after {
display: block;
width: 10px;
height: 20px;
background-color: #c0c;
float: left;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4181884
复制相关文章
相似问题