3

I have a nav bar in my footer of my page which is all set up and working in everything except, of course, in IE7. I used the :after pseudo element to place a pipe "|" after each <li> in the nav bar, but in IE7, it doesn't show up. It's not a big thing, it's not that ugly, but I can't seem to find anything to cludge it or trick IE7 to make it work.

4

4 回答 4

4

不。

截至 2012-01-03，此脚本仅支持 :before 和 :after 在 IE8 上：http ://code.google.com/p/ie7-js/

截至 2012 年 1 月 3 日，此处提到的 Selectivizr没有 :before 和 :after。

截至 2012 年 1 月 3 日，这看起来还没有准备好（尽管可能是）：https ://github.com/kevindees/ie7_pseudo_elements

我一直在寻找一种让这些伪元素在 IE7 上工作的方法，但看起来无法完成。

于 2012-01-03T23:08:37.190 回答
2

就我个人而言，我可能会使用 jQuery 添加一个<span>|</span> :beforeor :after。如果你只需要它来解决这个简单的问题，它可能会比整个库更轻量级（当然，这只有在你已经在使用 jQuery 时才有意义。

$('.element-with-after-class').append('<span class="ie-safe-pseudo-after>|</span>');

或者

$('.element-with-before-class').prepend('<span class="ie-safe-pseudo-before>|</span>');

或者

$('.element-with-after-class:not(.element-with-after-class:last-child)').append('<span class="ie-safe-pseudo-after>|</span>');
于 2012-01-03T23:20:35.350 回答
2

这是您的工作 IE7 代码：

HTML：

<ul>
    <li>link</li>
    <li>link</li>
    <li>link</li>
    <li>link</li>
</ul>​

CSS：

li {display: inline;}
li {*zoom: expression( this.runtimeStyle.zoom="1", this.insertBefore( document.createElement("i"), this.firstChild).className="ie-before" );}
li .ie-before {*zoom: expression(this.runtimeStyle['zoom'] = '1', this.innerHTML = '|');}​
于 2012-09-04T08:04:23.983 回答
0

自己没试过。

但我现在有一段时间的书签了。

看看： http: //forabeautifulweb.com/blog/about/enable_css_pseudo-element_selectors_in_internet_explorer_with_ie-css3.js/

编辑：

确保您还阅读了包含一些有用信息的评论（例如 jQuery）

于 2011-01-07T17:39:44.663 回答