使用CSS在无序列表文本之前渲染圆圈

Question

尝试使用以下jQuery将Material Design CSS字体放在我的文本前面：

    // Build the unordered list of classes with their name and CRN
    var text = '';
    text += '<ul class="list-group class-cart">';
    for (i = 0; i < result.classes[index].length; i++) {
        text += '<li class="list-group-item mdi-image-lens">' + result.classes[index][i]['short_name'] + ' (' + result.classes[index][i]['crn'] + ')</li>';
    }
    text += '</ul>';

我正在使用此库：http://fezvrasta.github.io/bootstrap-material-design/bootstrap-elements.html

特别是mdi-image-lens图标。

我试图从日历日历中模仿这个效果：

这样做，这就是我收到的：

天哪，这很可怕。

这通常是这样的：

任何想法如何保留文本大小和属性，还能在文本之前呈现漂亮的圆圈（不是项目符号点，因为它太小而无法实现所需的效果）？其次，我还有一个名为：

的变量

result.classes[index][i]['color']具有十六进制颜色值。我想使用这个十六进制值作为圆的颜色。

Answer 1

●←使用unicode圈怎么样？

它比子弹点（•）大一点。

unicode圈子的HTML实体是func gameLoopTimerTicked(timer:NSTimer){ if self.hitByEnemy { self.gameLoop?.invalidate() } } 。