Boootstrap glyphicons Firefox问题

Tho*_*gns 8 firefox twitter-bootstrap glyphicons

我知道还有许多与此相似的问题,但我似乎没有达到其他问题的任何标准.

My Bootstrap 3 glyphicons适用于除Firefox之外的所有浏览器.在Firefox上,它们显示为奇怪的符号.当从CDN提供glyphicons时,同样的问题是臭名昭着的,但这不是我的问题,因为我使用的是本地托管的字体文件.此外,我已经确保我的文件没有损坏.

这是我的代码.

<head>
    <link rel="stylesheet" type="text/css" media="screen" href="/assets/css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="/assets/css/bootstrap-style.css" />
    <link rel="stylesheet" type="text/css" media="all" href="/assets/css/style.css" />
</head>
Run Code Online (Sandbox Code Playgroud)

glyphicon的代码:

<span class="glyphicon glyphicon-list-alt section-icon"></span>
Run Code Online (Sandbox Code Playgroud)

我已经确保我的文件得到了适当的处理,并确保清除我的缓存.我不知道我在这里失踪了什么.建议?

Dam*_*ryx 16

Firefox有一个严格的设置(这个),阻止你的HTML文件从不在根目录的文件夹访问你的网络字体.这只发生在本地工作而不是服务器上的文件.您必须在Firefox中更改设置以在本地开发时显示字形.

- 在firefox中的地址中打开"about:config"

- 然后搜索"security.fileuri.strict_origin_policy"属性并将其从"true"更改为"false".(当然忽略引号)

  • 我在服务器上使用同一台服务器上的字体. (2认同)
  • 从开发人员的角度来看,你不能依赖用户来解决这个问题.解决方案必须是被动的,在用户端不活跃. (2认同)

Kin*_*mah 8

我有这个问题,但是从CDN服务bootstrap css为我解决了这个问题:

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
Run Code Online (Sandbox Code Playgroud)