CSS 伪元素 ▼ 在 IE 中变得乱码答案

【问题标题】：CSS pseudo element ▼ becomes gibberish in IECSS 伪元素 ▼ 在 IE 中变得乱码
【发布时间】：2012-04-03 08:02:58
【问题描述】：

我使用 ▼ 字符作为我的伪元素的内容：

a:after {
    content: '▼';
}

这适用于所有现代（阅读：非 IE）浏览器：

但在 IE(9) 中，我只会乱码：

我猜这与字符编码有关，但我不知道从哪里开始。

【问题讨论】：

你试过content: '\9660';吗？您的 CSS 文件和网页是否使用相同的字符集？您的 CSS 中的 @charset 是否与其 MIME 类型不同？

标签： css internet-explorer internet-explorer-9 pseudo-element

【解决方案1】：

确保您的页面和样式表均以 UTF-8 编码和提供。大多数编辑器应该能够告诉您任何打开文件的编码。

您也可以选择使用 Unicode 序列 \9660，但同样您需要确保您的文档被编码为 UTF-8，否则它也可能无法正常工作：

a:after {
    content: '\9660';
}

或者，如果您的样式表有 @charset 规则，它需要指向 UTF-8：

@charset "UTF-8";

注意@charset rules need to appear at the very beginning of a stylesheet;在@imported 文件中我相信这不应该是一个问题，但是看到Sass 在编译期间实际上将由@import 规则链接的文件组合在一起，这将导致错误。对于 Sass/SCSS，您需要将 @charset 规则放在主样式表的开头。

【讨论】：

我正在使用 SASS，我刚刚意识到他们正在将 @charset "IBM437"; 添加到我的 CSS 文件的开头。我能做些什么吗？
@MegaHit：改成@charset "UTF-8";
您是说每次保存 SASS 文件后我都必须更改它吗？有没有办法阻止 SASS 在那里添加它？
根据groups.google.com/forum/?fromgroups#!topic/sass-lang/… SASS 是这样添加的，因为您的输入文件是用 IBM437 编码的；您应该将输入文件更改为 UTF-8。
@Domenic - 我已经检查了两次和三次，但我的.scss 文件肯定是使用 UTF-8 编码的。

【解决方案2】：

除了@BoltClock 的回答，一定要send appropriate headers from your server，也许只是为了更好的衡量，在你的<head> 标签中添加一个<meta charset="utf-8" />。

【讨论】：

【解决方案3】：

您也可以尝试在菜单中添加背景图片。

 a{background:url("http://pathtoyourimage/");}

【讨论】：