Question

我想用红色和绿色显示Unicode字符“ BLACK CIRCLE FOR RECORD”。 http://www.fileformat.info/info/unicode/char/0023FA/index.htm

这是我的CSS CSS

<!DOCTYPE html>
<html>
<body>
  <div color="red">⚫</div>
  <div color="red">&#x23FA</div>
</body>
</html>

但是我没有得到预期的结果

任何建议如何解决此问题？结果： https://jsfiddle.net/y8uz25Lv/

Answer 1

这在技术上是不可能的。

可怕的破解方法是隐藏表情符号本身并显示阴影。

.red {
  color: transparent;
  text-shadow: 0 0 0 red;
}

<div class="red">⚫</div>

警告：这会破坏表情符号上的阴影，这是副作用。

更好的解决方案可能是首先使用更合适的字符（例如U + 2B24）。

.red    { color: red; }
.yellow { color: yellow; }
.green  { color: green; }

<div class="red">⬤</div>
<div class="yellow">⬤</div>
<div class="green">⬤</div>

Answer 2

它是一个黑色圆圈。您无法着色。

使用＆＃x1f534