Question

我已经使用bootstrap-select实现了一个选择下拉列表，但由于某种原因，一些奇怪的字形无意中出现而且没有渲染，因此在此应用程序中的每个电台名称后面显示为正方形。

以下是应用：http://radiant-taiga-9193.herokuapp.com/

以下是使用glyphicon在每个电台名称后呈现的相关代码：

<i class="glyphicon glyphicon-ok icon-ok check-mark"></i>

这是我尝试修复失败的原因：

.glphicon, .glyphicon-ok, .icon-ok, .checkmark {
    visibility: hidden;
}

有什么建议吗？

Answer 1

您未正确加载字体文件。检查控制台，因为字体会出现404错误。

Failed to load resource: the server responded with a status of 404 (Not Found) http://radiant-taiga-9193.herokuapp.com/assets/twitter/fonts/glyphicons-halflings-regular.woff

Failed to load resource: the server responded with a status of 404 (Not Found) http://radiant-taiga-9193.herokuapp.com/assets/twitter/fonts/glyphicons-halflings-regular.ttf

Failed to load resource: the server responded with a status of 404 (Not Found) http://radiant-taiga-9193.herokuapp.com/assets/twitter/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular

Answer 2

使用

.check-mark { display: none !important }

奇怪的glyphicon出现并且没有使用bootstrap-select渲染

2 个答案: