Question

我的ASP.NET MVC应用程序中有一个奇怪的问题：IE和Safari中没有显示bootstrap glyphicons，但是在Google Chrome和FireFox中成功显示。

我检查过在较少的文件中，我有正确的文件路径（.eot和其他）。但它在IE和Safari中不起作用。在浏览器检查器中查看html和css时，我看到glyphicon的类具有被攻击的属性内容，但在Chrome中它没有受到攻击。我也开始在IE设置中允许字体加载，但它没有帮助。我正在使用Bootstrap 3.3.6。

我在IE 11和Edge以及Safari中遇到过这个问题。

请告诉我如何解决这个问题？

更新

            <p class="input-group">
                <input name="startDate" type="text" uib-datepicker-popup="{{format}}" ng-model="startDate" is-open="status.startDateOpened" datepicker-options="dateOptions" close-text="Close" />
                <span class="input-group-btn">
                    <button type="button" class="btn btn-default" ng-click="openStartDate($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                </span>
            </p>

Answer 1

在一些StackOverflow搜索之后，似乎以前遇到过这个问题。问题可能涉及HTTP标头Cache-Control：字体的无缓存。虽然这适用于HTTP，但通过HTTPS会导致Internet Explorer忽略下载的字体。

我最好的猜测是这种行为的变体：http://support.microsoft.com/kb/815313

因此，如果您在开发人员工具网络视图中看到IE通过每种字体工作，则可能值得检查您是否具有Cache-Control标头并将其删除。

对另一案例的引用：Bootstrap (v3.3.4) glyphicons not displayed in IE when refresh page (F5)

另一个是我发现的原始可能解决方案：@font-face EOT not loading over HTTPS

Bootstrap glyphicons未在IE和Safari中显示

1 个答案: