为什么我的CSS没有在网络浏览器中更新？

Question

在对我的网站进行编码时，我会保存HTML和CSS文档，然后刷新浏览器以查看更改。但是，当我刷新HTML时，会看到更改，但CSS更改却没有。相反，我需要关闭窗口并再次重新打开它以查看我的CSS更改。

为什么我不能刷新并看到CSS更改而不是关闭窗口并重新打开？

Answer 1

尝试“硬”刷新浏览器...

http://en.wikipedia.org/wiki/Wikipedia:Bypass_your_cache

想法是绕过浏览器的缓存。不同的浏览器以不同的方式处理这个问题，这篇wiki文章为每个主要浏览器提供了一个很好的演练方法。

或者，您可以清除浏览器的缓存，这也包含在wiki文章中。

Answer 2

我认为这是缓存问题。

如何找到问题

如果您使用的是Chrome或Firefox或Safari，只需右键点击该页面并选择inspect element，然后选择network标签。

现在像往常一样刷新您的页面，您将看到所有这样的http请求：

如果css文件状态为304，表示浏览器询问服务器css文件，服务器说：＆＃34;不，你不需要问我，我之前给了你css文件，它没有改变。＆＃34;

如果css文件状态为200，但大小为from cache，则表示浏览器甚至不向服务器询问该文件，浏览器认为他有最新文件。

我认为你处于第二种情况（200来自缓存）。

如何解决这个问题：

1. 您可以随时清除浏览器缓存以查看更改。或者您可以禁用浏览器缓存以进行调试。

   但是你总是不能告诉访问者清除缓存，所以第二种方法是：

2. 如果您使用PHP或其他任何服务器语言，请将查询字符串附加到css文件名：

   <link rel="stylesheet" type="text/css" href="http://www.example.com/style.css?ts=<?=time()?>" />

   99％的时间，这都有效。

3. 如果它是一个静态html页面，您可以手动更改css查询字符串（如果愿意，甚至可以更改css文件名）。

Answer 3

根据浏览器的不同，它可能是一个缓存问题。

您的浏览器中可能存在阻止缓存更新的设置。

您是否尝试将浏览器重置为默认值？

我问的原因是，Firefox和Chrome的处理方式不同。

如果清除Firefox中的缓存+ cookie，则在关闭所有浏览器窗口之前它可能不会生效。

Chrome会使用每个标签刷新缓存。

我建议您重新安装浏览器，因为这肯定是本地问题，但不属于css本身。