在Chrome中刷新后，字体Awesome图标会消失 [英] Font Awesome icons disappear after refresh in Chrome

问题描述

Bootstrap版本3

Bootstrap version 3

Font Awesome版本3.2.1

Font Awesome version 3.2.1

我遇到bootstrap和字体的问题真棒在Chrome。当我最初加载一个页面，字体真棒图标显示正确。当我刷新页面时，图标消失。 **要澄清，整个图标丢失，这不是一些其他人遇到的空框问题。

I am having issues with bootstrap and font awesome on Chrome. When I originally load a page, the font awesome icons are displayed correctly. When I refresh the page, the icons disappear. **To clarify, the entire icon is missing, this is not the empty box issue that some others encounter.

我在这里抓住稻草，但我注意到是在原始页面加载和刷新之间检索文件的顺序的差异。

I'm grasping at straws here, but I noticed there were differences in the order in which the files were retrieved between the original page load and the refresh.

当页面刷新时，字体文件是最后一个项目

When the page is refreshed, the font file is the last item to be retrieved, and it appears to be a cached version as well.

最后，位于< div class =中的任何图标，当鼠标悬停在 div 上时，将加载btn> 。

Finally, any icons that are located inside of a <div class="btn"> will be loaded when the mouse hovers over the div.

初始页面加载

Initial page load

页面刷新

Page refresh

推荐答案

我想你在一台Windows机器上，对吧？

I guess you are on a Windows machine, right?

这是Chrome的旧问题。有关CSS技巧，请参见此帖。下一篇帖子应该是你的问题的答案。

This is an old problem with Chrome. See this posting on CSS Tricks. The next to last post should be the answer to your question. Or in short: Use the PUA (Private Use Area) for encoding.

每个图标的Unicodes（PUA代码）都列在取消Awesome CSS文件 - 请参阅：Font Awesome使用Unicode私人使用区域（PUA）... （在第190行附近）。

The Unicodes (PUA codes) for each icon are listed in the Font Awesome CSS file - see: Font Awesome uses the Unicode Private Use Area (PUA)... (around line 190).

这篇关于在Chrome中刷新后，字体Awesome图标会消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！