Icomoon 图标无法在 Safari 上正确呈现

问题描述

各位,我在 Safari 上渲染 icomoon 图标时遇到问题,它们看起来比在 Chrome 上看起来更大胆、更大。

我尝试设置 font-sizefont-weight 但这似乎不起作用

这些是我正在应用的样式,我使用的是 bootstrap 4,所以我覆盖了它们 dropdown认图标

.dropdown-toggle::after {
  font-family: 'icomoon' !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\e97b';
  border-top: 0px solid;
  font-size: 6px;
  margin-left: 8px;
}

这是 HTML:

<button
  ref={props.buttonRef}
  className="btn btn-secondary dropdown-toggle d-flex align-items-center"
  type="button"
  data-toggle="dropdown"
  onClick={openDropdown}
  aria-haspopup="true"
  aria-expanded={getState().isOpen}
  disabled={props.disabled}
>
  <span className="shrink-text">{props.placeholder}</span>
</button>

以下是它们外观的一些屏幕截图: 铬合金

Chrome

野生动物园

Safari

知道它是什么吗?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)