我有一堆列表
<ul>
<li class="first">Item 1</li>
<li>Item 2</li>
<li class="last">Item 3</li>
</ul>
风格化
li:after {
content: ' / ';
}
li.last:after {
content: '';
}
这一定是一种常见的问题。我想我可以弄乱html并放入包含字符的中介<li>，或者如果IE是加载浏览器，我可以连接一个javascript将它们放在那里，但这不会抓住人们没有javascript。伊诺。我倾向于使 html 变得混乱，但我想听听对此是否有一些意见。
【问题讨论】：
标签： css internet-explorer css-selectors
如果您的内容不打算在运行时更改，您可以使用以下内容：
.icon-glass {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
如果您的内容打算在运行时更改，您可以执行以下操作：
.icon-glass {
*top:expression(0, this.innerHTML = '');
}
不幸的是，这非常慢。虽然它可能在 IE6 中工作，但会显着降低性能，但如果页面上有太多图标，IE7 可能会崩溃。所以我不会推荐第二种技术，除非你只使用很少的图标并且你可以承受性能下降。
【讨论】：
尝试使用类似 jQuery 的东西。
`$(函数(){
$('li').not(':last-child').append('\'');
});`
它不会弄乱 html。 此外，要使其仅适用于 IE，请尝试使用 jquery 兼容性。
【讨论】：
Internet Explorer (IE) 不支持 :after 选择器，我们必须改用一些技巧，例如这个：
li { scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + 'xkcd150') : ''); }
"xkcd150" - 这个将被添加到每个<li> 之后。
它是一个表达式，通常用于替换和修复一些 IE 错误。
所以，完整代码是：
li { scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + ' / ') : ''); }
li.last {
scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + '') : ''); }
第一行加“/”，第二行什么都不加。
所有代码都必须添加到您的 css 文件中。
【讨论】：
我使用 javascript 和条件 cmets。即使用 jQuery。
<!--[if IE 6]>
<script type='text/javascript'>
$(document).ready( function() {
$('li').not('li.last').after('/');
});
</script>
<![endif]-->
使用单独的 JS 文件当然更好。
这也有一个缺点，即您必须将所有内容编写两次，因为您将它放在 CSS 中以用于良好的浏览器，并再次在 javascript 中用于 IE6。
【讨论】：
如果 IE 支持 last-child，您就不需要执行 class="last" :P。
IE 支持一直并将继续是垃圾。 IE 8 已经做出了巨大的改进， :after 和 :before 正如你所期望的那样工作，IE 7 也支持它们。只针对这两个，特别是因为微软正在推出 IE 8 而不是 Windows 更新。
【讨论】：
【讨论】：
这是一个你不喜欢的想法。 8-) 将您的 / 符号作为背景图像放入 <li>s 的右侧填充中。
【讨论】：
我只是在生成列表 HTML 时使用服务器端语言来完成。我想这会被认为是“混乱的 HTML”。
【讨论】：