引导字体在Safari iOS上似乎是条带化的

我创建了一个简单的应用程序，它使用bootstrap版本3.3.5和一个带有下拉菜单的按钮：

<!-- Large button group -->
<div class="btn-group">
  <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Large button <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    ...
  </ul>
</div>

如果在Safari iOS上运行，则向下图标似乎被切断：

---

这个问题有解决方案吗？

我发现了这个问题，它是由caret css类造成的：

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

我修改了以下行，来自：

  border-top: 4px dashed;

到

---

它工作正常。

我发现了这个问题，它是由插入符号css类造成的：

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

我修改了以下行，来自：

  border-top: 4px dashed;

到

---

它工作得很好。

您是在为这些图标使用字体，还是内置的字体？我使用引导类来构建图标和按钮…您是在为这些图标使用字体，还是内置的字体？我使用引导类来构建图标和按钮。。。