李：在内容之前：“✔”;某些移动设备上的颜色不同

Question

我写css以使li标签更好。

笔记本电脑和手机（lenovo vibe 1）和华硕zenfone 5都可以。

但是当我在Iphone 5和Galaxy Note3上测试时，我的颜色（rgb（240,230,140））显示为红色和黑色。

我不知道我的CSS有什么问题。我应该使用图像而不是css还是有css的解决方案？ 感谢。

这是我的css：

ul.anamenu li::before {
content: "✔ ";
color: rgb(240, 230, 140);
font-size: 4vmin;
text-indent: -2em;}

Answer 1

尝试在font-family: 'Zapf Dingbats'上添加ul.anamenu li::before。它适用于iPhone。

编辑：JUN 26＆＃39; 17

问题的存在是因为这个角色现在是Apple（以及其他构造函数）绘制的表情符号。在emojipedia网站上，您可以看到此表情符号的一些变体。

因此，您渲染的角色是设备上的位图图像，而不是可以更改颜色的矢量字形。实现表情符号的构造函数或平台可以根据需要自由设计自己的表情符号（如果需要，可以使用黑色，红色，粉红色或其他颜色）。这就是为什么我们可能会误解一个表情符号depending on the platform where we see it的含义。

  

Unicode标准中目前有1,282个表情符号，由Unicode Consortium设置，它提供了一个名称，例如U + 1F600用于“咧嘴笑脸”，＆＃39;但关键的是，并没有规定表情符号应该是什么样的。

要改变这个角色的颜色，你必须处理文字。因此，您可以在复选标记后直接使用variation selector 15来获取常规文本版本：✔︎（以HTML格式）。对于不同语言here的一些例子。

顺便说一句，关于重复校验标记，您可以使用变异选择器content: "\2714 \fe0e";来尝试此解决方案。如您所见，CSS中有unicode symbole：'\2714'和VARATION SELECTOR＆＃39; \ fe0e＆＃39;直接在。之后。

＆＃13;

＆＃13;

.unicode:after{
  content: '\2714 \fe0e';
  color: red;
}

＆＃13;

<div class="unicode">
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

正如Alex-DJDB所说，您不能更改此html符号的颜色。但是您可以使用另一个。使用sudo -E /usr/local/bin/go build -o /tmp/snap github.com/snapcore/snapd/cmd/snap可以更改符号的颜色。

我在这里找到它：https://graphemica.com/%E2%9C%93

✓ check mark (U+2713)

html {
  color: red;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

Answer 3

您可以使用FontAwesome

＆＃13;

＆＃13;

ul {list-style: none;}
ul li{position: relative;padding-left: 20px}

 ul li:after{
 content: '\f00c';
 font-family: FontAwesome;
 position: absolute;
 left: 0;
 top: 0;
 color: red
 
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<ul>
  <li> test  </li>
  <li> test  </li>
  <li> test  </li>
</ul>

＆＃13;

＆＃13;

＆＃13;