如何在CSS中的Bootstrappanel-heading之后插入HTML符号？

Question

我在 bootstrap 面板的末尾添加了一个 > 符号，以便在切换时展开面板。

但是当我将大于符号的 HTML character entity > 添加到此转换的 css 样式时。它呈现符号的 HTML 代码而不是符号：

我正在使用的完整示例位于此处：

http://www.prepbootstrap.com/bootstrap-template/faq-example

如何使用 CSS 在面板内渲染 HTML 特殊字符？

这是我对 styl 的尝试，它确实按预期旋转了字符，但未显示符号：

.panel-heading [data-toggle="collapse"]:after {
        font-family: Verdana;
        content: "&gt"; /* "play" icon */
        float: right;
        color: #F58723;
        font-size: 18px;
        line-height: 22px;
        /* rotate "play" icon from > (right arrow) to down arrow */
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }

Answer 1

如果我按照您提供给我们的 link 进行正确操作，就会得到 CSS 的代码。此处您正在处理 CSS 而不是 HTML。您不应该使用 CSS 代码而不是 html 代码 content: '[=11=]3e'; 吗？只是猜测，我从来没有这样做过。

如果它不起作用，您可能必须使用 :after 这样代码就不会被覆盖。

我已经用这种方法测试过并且有效。希望对您有所帮助 ;)

h1:after {
    content: '[=10=]3e';
}

如何在CSS中的Bootstrappanel-heading之后插入HTML符号？

How to insert HTML symbol after Bootstrap panel-heading in CSS?

css

icons

html-entities

twitter-bootstrap-3