更新CSS版本并清除浏览器缓存?

Question

当我在我的网站上更新CSS时，它向我显示旧版本。 它似乎是css版本的浏览器保存缓存。

如何清理浏览器的缓存并在每次编辑它们时获取最新版本？

Answer 1

您可以在加载 css 时使用缓存无效化程序。 只需在文件名后添加一个?v=1.1：

<link rel='stylesheet' href='styles.css?v=1.1' type='text/css' media='all' />

然后在更改 CSS 时递增它，它将强制浏览器重新加载它并且不使用其缓存版本。

编辑：

您还可以使用在其他任何地方(例如在单独的配置文件中(设置的 PHP 变量来同时与其他多个文件一起递增它，而无需始终编辑模板。

$file_version = 1.1;

然后

<link rel='stylesheet' href='styles.css?v=<?= $file_version ?>' type='text/css' media='all' />

CSS 和 JS 文件由浏览器缓存，页面的简单刷新不会加载新版本。因此，使用此无效参数更改 url 将使浏览器重新加载它。