html - 中等黑色圆圈在某些设备上始终为黑色

Question

我使用的是 Unicode 字符“MEDIUM BLACK CIRCLE”又名:⚫

然后改变它的颜色。它在我的大多数设备上运行良好，但在我的安卓手机和一些同事的电脑上(相同的电脑品牌和浏览器)它总是黑色的，而不是#009FDA。

<span style="color:#009FDA;">&#9899 </span> 

如何解决这个问题？

解决了!

解决方案( Font Awesome ): <i class="fa fa-circle" style="color:#009FDA;" aria-hidden="true"></i>

如果有人知道的话，我仍然很想知道为什么会发生这种情况......

Answer 1

你有两个选择

选项一:Unicode字符

使用 Unicode 字符。它有效

body{
  font-size:15px;
  line-height:15px;
}

<span style="color:#009FDA; ">&#9899 </span> 
<br/>
<span style="color:#009FDA; font-size:250%; height:15px; ">•</span> 

选项 2:使用 border-radius 塑造圆形(适用于所有浏览器)

具有 border-radius:50%; 和相同宽度和高度的圆的类

span.circle{
  height:10px;
  width:10px;
  border-radius:50%;
  background-color:#009FDA;
  display:inline-block;
}

<span class='circle'></span>

其他选项:您可以使用 Font-awesome 、svg 或图片