css - 如何更改 unicode 符号的背景颜色？

Question

我试图让红心 U+1F0B1 的 unicode ace 保持白色，主体背景为绿色。我在想我需要创建一个与卡片大小相同的 div 并将其设置为白色。有更好的方法吗？

Answer 1

这是示例方法。但您需要根据 unicode 的字体大小调整“文本缩进”和“字母间距”。 看下面的代码

body {
background: grey;
}
i {
    position: relative;
    display: inline-block;
}
i::before{
   content: "\1F0B1";
    font-style: normal;
    color: white;
    display: block;
    line-height: 0.8;
    font-size: 150px;
    background: green;
    letter-spacing: -10px;
    text-indent: -10px;

}

<i class="heart"></i>