使用引导字形图标答案

【问题标题】：Using Bootstrap Glyphicons使用引导字形图标
【发布时间】：2015-04-22 14:07:27
【问题描述】：

我正在尝试使用来自 twitter bootstrap 的字形图标。我想使用伪元素 :after 而不是 before。

.glyphicon.glyphicon-search:before 以上工作正常。

.glyphicon.glyphicon-search:after 上面的不行。

我做错了什么？

【问题讨论】：

【解决方案1】：

这是因为 glyphicon 类仅适用于 :before 而不是 :after。如果您查看 CSS 中的源代码，您会看到。一个例子是：

.glyphicon-asterisk

这个css看起来是这样的：

.glyphicon-asterisk:before {content: "\2a";}

如果是这样的话：

.glyphicon-asterisk:before,
.glyphicon-asterisk:after {content: "\2a";}

你将能够做你的事。您需要创建一个新类并添加如下内容：

.glyphicon-asterisk:after {content: "\2a";}

【讨论】：

【解决方案2】：

可能是语法问题。试试.glyphicon.glyphicon-search::after？

【讨论】：

所有支持双冒号 (::) 语法的浏览器也只支持 (:) 语法，但 IE 8 只支持单冒号，所以目前建议只使用单冒号以获得最佳浏览器支持。 :: 是一种较新的缩进格式，用于区分伪内容和伪选择器。如果您不需要 IE 8 支持，请随意使用双冒号。
我可以尝试使用双冒号，但我认为这不会导致问题。 .glyphicon.glyphicon-search: 在 {content: "/E###"} 之后； .glyphicon.glyphicon-search:before {content: "/E###"};由于某种原因，后者有效，但不是第一个。
errr 实际上我在想这可能是由于;。试试.glyphicon.glyphicon-search:after {content: "/E###";}。里面有分号，因为这是 CSS，而不是 JS。 @user3259232
对不起，semi实际上在里面。
@user3259232 介意创建一个 jsfiddle 来准确显示您的代码是如何工作的？