如何使用非Unicode方式实现加减号，解决Chrome、Edge中字符颜色不生效问题

解决方案 #

你遇到的是Emoji类Unicode字符的渲染问题：\02795对应的是「Heavy Plus Sign」Emoji变体，这类字符默认会以彩色Emoji形式渲染，不受CSS color属性控制，可通过以下两种方式解决：

方案1：替换为普通无预定义颜色的加号字符 #

直接将content值替换为标准ASCII加号的Unicode码\002B，或者直接写纯文本+即可，这类纯文本字符完全支持color属性控制颜色，修改后的代码如下：

.accordian:after {
  content: '\002B'; /* 标准无样式加号，等同于直接写'+' */
  font-size: 17px;
  color: #fff;
  float: right;
  margin-left: 5px;
}

如果需要和原来的粗体加号样式更接近，可以额外加font-weight: bold属性调整粗细。

方案2：强制原字符以文本形式渲染 #

如果不想替换字符，可以强制浏览器将该Emoji字符按普通文本渲染，添加两个CSS属性即可：

.accordian:after {
  content: '\02795';
  font-size: 17px;
  color: #fff;
  float: right;
  margin-left: 5px;
  /* 新增以下两行 */
  font-family: system-ui, sans-serif; /* 优先使用文本字体而非Emoji字体渲染 */
  font-variant-emoji: text; /* 显式指定以文本模式渲染Emoji */
}

内容的提问来源于stack exchange，提问作者Heather