如何重置CSS字体缓存。

Question

我在服务器上更改了字体，但浏览器获取的是字体写入的旧版本CSS文件，如何重置缓存？我已尝试删除浏览器缓存和删除旧的CSS文件，但它们仍然获取旧的CSS。我已尝试重新加载服务器，该如何修复？

- Hello

Answer 1

我注意到这种情况只会在Firefox浏览器中出现，非常令人恼火。但是，如果你也遇到了同样的问题，在Mac电脑上按SHIFT + CMD + R（如果你在Windows上，则应该是CTRL + SHIFT + R）可以刷新页面并清除缓存。这样做应该能够显示字体 :)

- Andrew Lazarus

---

这对您/开发人员可能很好用，但对于已经加载了旧版CSS和字体的用户来说，这并不是一个好的解决方案。 - tofraser

请原谅这个答案是在2013年编写的，技术已经发生了变化，6年后。 - Andrew Lazarus

在Firefox中，通常的重新加载页面的方法不会刷新字体缓存。可能有效的一种方法是“历史记录>删除最近的历史记录-全部”。请参见此问题。 - tenbob

Answer 2

请确保您的浏览器没有显示本地字体 - 我花了将近一个小时才弄清楚如何在Firefox中清除字体缓存，而问题与此无关。

检查您的Web服务器日志：是否已下载字体文件？ 如果没有，则很可能正在使用本地字体。

考虑以下真实情况：

@font-face{
    font-family: SuperFont;
    src: url('../fonts/Superfont.ttf'),
}

我从某个地方复制粘贴了这段代码，删除了部分src定义，没有注意到结尾的逗号导致这一行CSS无效。因此字体未被下载。

然而，由于我已经在本地安装了Superfont，所以它似乎可以工作，因为浏览器识别了font-family。直到我决定更改字体文件，但保留font-family定义以避免进一步修改CSS文件时才出现问题...

道德：在测试字体时，请使用明确的自定义font-family名称。

- Skippy le Grand Gourou

Answer 3

只需为URL添加版本即可。

@font-face{
    font-family: FontName;
    src: url('fonts/FontName.woff2?v=2.0') format('woff2'),
         url('fonts/FontName.eot?#iefix&v=2.0') format('eot');
}

- JustS

Answer 4

你尝试过在不同的浏览器中查看页面，以确保旧字体未添加到页面中吗？

如果您仍在使用相同的CSS文件，可以导航到CSS文件并对其进行强制刷新Ctrl + F5。

此外，在清除缓存之前完全关闭页面也有助于解决问题！

- James Donnelly

Answer 5

在浏览器上执行：Ctrl + F5

- Kowo