html - 带虚拟主机的 Bootstrap 字形图标

Question

我正在尝试让 glyphicons 与我的本地元素一起工作!

我创建了一个名为 backend.mvc 的虚拟主机

现在，每当我尝试使用 glyphicons 时，我都会收到以下错误:

"NetworkError: 404 Not Found - http://backend.mvc/site/resources/css/fonts/glyphicons-halflings-regular.woff"
    glyphi...ar.woff
    "NetworkError: 404 Not Found - http://backend.mvc/site/resources/css/fonts/glyphicons-halflings-regular.ttf"

但是路径存在于 http:// 之外，所以我的问题是如何避免这种情况并使字形图标工作？

编辑

我在我的头上添加了以下内容:

    <link type="application/font-woff">
    <link type="application/vnd.ms-fontobject">
    <link type="application/x-font-ttf">
    <link type="font/opentype">

但是这没有任何作用:(

更新

使用 Apache

另请注意，这是针对网络而非移动设备的!

Answer 1

如果您绝对确定它们没有在错误的位置，那么在提供网络字体时，我遇到此类问题的最常见原因是服务器未配置为提供服务文件的正确 MIME 类型。

根据 HTML5 boilerplate这些是您在提供网络字体时应该使用的 MIME 类型:

woff: application/font-woff

eot: application/vnd.ms-fontobject

ttf & ttc: application/x-font-ttf

otf: font/opentype