Html 如何在字母周围画一个圈？

我需要在字母“a”后面画一个小圆圈。什么样的CSS会产生这种效果

见示例：

---

是否使用CSS？像这样的

i
.i-圈{
背景：#ff0000；
颜色：#fff；
填充：5px20px；
边界半径：50%；
字体大小：35px；
}

<span class="i-circle">i</span>

.i-circle {
    background: #ff0000;
    color: #fff;
    padding: 5px 20px;
    border-radius: 50%;
    font-size: 35px;
}