javascript - IE7 中使用::after &::before 伪元素的特定箭头

Question

我在使用 IE7 时再次遇到问题。

我尝试使用::after &::before 伪元素也在我的条目光标末尾添加一个箭头。它没有显示在 jsfiddle 的代码中，但用户必须完全自由地设计箭头(大小、类型、颜色等)。

查看 jsfiddle

http://jsfiddle.net/22hNA/6/

<div style=" " 
             id="progress" 
             class="progress">
            <div unselectable="on" style="
                                          color:rgb(0,94,149); 
                                          border-color: rgb(0,0,151);
                                          border-style: dashed;" 
                 id="progressAmount" 
                 class="amount progressamount pseudoelement-after rightRightPlainArrow">

                    <div class="arrow_box ">
                        28
                    </div>

    .progressamount:after, .progressamount:before,
div[class*=pseudoelement] > .before, div[class*=pseudoelement] > .after  {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
}

/* ------------------------------------------------ right-right plain arrow ------------------------------------------------ */
.rightRightPlainArrow:after,
.rightRightPlainArrow[class*='pseudoelement'] > .after {
    border-right-color: rgb(0,0,0);
    border-width: 13px;
    margin-top: -13px;
    right: -13px;
}
/* ------------------------------------------------------------------------------------------------------------------- */

及其全屏结果

http://jsfiddle.net/22hNA/6/embedded/result/

您可以猜到它在 IE8+ 和 Chrome 上运行良好，但由于 IE7 不支持这些伪元素，因此它不适用于此版本。

我尝试了很多不同的东西，比如使用 IE8.js 或 jquery 伪插件，但在我的情况下似乎不起作用(IE8.js 在我的页面中弄得一团糟)。我还尝试了 luke lutman 的另一个 jquery 伪插件，但我不知道它是否不起作用或者我只是不明白如何使用它。原因可能是我已经在使用很多不同的工具来使 IE7 兼容，例如渐变过滤器或半径和阴影的 CSSPIE 库(不在 fiddle 中)。

我的例子够清楚吗？我试图简化它，但最初简化起来很困惑，因为我也在其中使用了很多私有(private)脚本。

如何让这个小箭头在 IE7 中出现(并使用::after &::before 伪 el)？

有时这是不可能的吗？

谢谢你，蒂姆

Answer 1

尝试 UTF-8 Unicode block 箭头或三 Angular 形

CSS

content : "◀";

参见

http://utf8-chartable.de/unicode-utf8-table.pl?start=9600&number=128

http://utf8-chartable.de/unicode-utf8-table.pl?start=8576