CSS CSS文件在浏览器中不刷新
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2263096/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS file not refreshing in browser
提问by jbcedge
When I make any changes to my CSS file, the changes are not reflected in the browser. How can I fix this?
当我对 CSS 文件进行任何更改时，这些更改不会反映在浏览器中。我怎样才能解决这个问题？
回答by Pekka
For weeks? Try opening the style sheet itself (by entering its address into the browser's address bar) and pressing F5. If it still doesn't refresh, your problem lies elsewhere.
对于周？尝试打开样式表本身（通过在浏览器的地址栏中输入其地址）并按F5。如果它仍然没有刷新，则您的问题出在其他地方。
If you update a style sheet and want to make sure it gets refreshed in every visitor's cache, a very popular method to do that is to add a version number as a GET parameter. That way, the style sheet gets refreshed when necessary, but not more often than that.
如果您更新样式表并希望确保它在每个访问者的缓存中得到刷新，一种非常流行的方法是添加版本号作为 GET 参数。这样，样式表会在必要时刷新，但不会更频繁。
<link rel="stylesheet" type="text/css" href="styles.css?version=51">
回答by RainCast
The fix is called "hard refresh" http://en.wikipedia.org/wiki/Wikipedia:Bypass_your_cache
该修复程序称为“硬刷新” http://en.wikipedia.org/wiki/Wikipedia:Bypass_your_cache
In most Windows and Linux browsers: Hold down Ctrl and press F5.
在大多数 Windows 和 Linux 浏览器中：按住 Ctrl 并按 F5。
In Apple Safari: Hold down ? Shift and click the Reload toolbar button.
在 Apple Safari 中：按住 ? Shift 并单击重新加载工具栏按钮。
In Chrome and Firefox for Mac: Hold down both ? Cmd+? Shift and press R.
在 Chrome 和 Firefox for Mac 中：同时按住 ? 命令+？Shift 并按 R。
回答by Dave Markle
A good way to force your CSS to reload is to:
强制重新加载 CSS 的一个好方法是：
<link href='styles.css?version=1' rel='stylesheet'></link>
And then just increment the version number as you change your CSS. The browser will then obey. I believe StackOverflow uses this technique.
然后在更改 CSS 时增加版本号。浏览器将服从。我相信 StackOverflow 使用了这种技术。
回答by mythz
I always use Ctrl+Shift+F5out of habit, it should force a full-refresh including by-passing any http proxies you may be going through.
我总是用Ctrl+ Shift+F5习惯了，就应该强制完全刷新包括绕过你可能会经历任何HTTP代理。
回答by Manoj Mohan
Do Shift+F5in Windows. The cache really frustrates in this kind of stuff
在 Windows 中执行Shift+ F5。缓存在这种东西中真的很令人沮丧
回答by Mostly
I had this issue, I was scratching my head for the best part of two days.
我遇到了这个问题，两天的大部分时间我都在挠头。
Turns out I completely forgot I had CloudFlare setup on the domain I was live testing on.
结果我完全忘记了我在实时测试的域上设置了 CloudFlare。
CloudFlare caches your JavaScript and CSS. Turned on development mode and BAM!
CloudFlare 缓存您的 JavaScript 和 CSS。开启开发模式和BAM！
Seriously... two whole days.
说真的……整整两天。
回答by Zw1d
Having this problem before I found out my own lazy solution (based on other people suggestions). It should be helpful if your <head>contents go through php interpreter.
在我发现自己的懒惰解决方案之前遇到了这个问题（基于其他人的建议）。如果您的<head>内容通过 php 解释器，应该会有所帮助。
To force downloading file every time you make changes to it, you could add file byte size of this file after question mark sign at the end.
要在每次更改文件时强制下载文件，您可以在最后的问号后添加此文件的文件字节大小。
<link rel="stylesheet" type="text/css" href="styles.css?<?=filesize('styles.css');?>">
EDIT: As suggested in comments, filemtime()is actually a better solution as long as your files have properly updated modify time (I, myself, have experienced such issues in the past, while working with remote files):
编辑：正如评论中所建议的，filemtime()只要您的文件正确更新了修改时间，实际上是一个更好的解决方案（我自己过去在使用远程文件时遇到过此类问题）：
<link rel="stylesheet" type="text/css" href="styles.css?<?=filemtime('styles.css');?>">
回答by Roshna Omer
The Ctrl+ F5solusion didn't work for me in Chrome.
在Ctrl+ F5solusion没有在Chrome中为我工作。
But I found How to Clear Chrome Cache for Specific Website Only (3 Steps):
但我发现如何仅清除特定网站的 Chrome 缓存（3 个步骤）：
- As the page is loaded, open Chrome Developer Tools (Right-Click > Inspect) or (Menu > More Tools > Developer Tools)
- Next, go to the Refresh button in Chrome browser, and Right-Click the Refresh button.
- Select "Empty Cache and Hard Refresh".
- 加载页面后，打开 Chrome 开发人员工具（右键单击 > 检查）或（菜单 > 更多工具 > 开发人员工具）
- 接下来，转到 Chrome 浏览器中的“刷新”按钮，然后右键单击“刷新”按钮。
- 选择“清空缓存和硬刷新”。
Hope this answer helps someone!
希望这个答案对某人有所帮助！
回答by Andy Brown
If you're using ASP.NET web forms, make sure that you are using the right theme:
如果您使用的是 ASP.NET Web 表单，请确保您使用的是正确的主题：
I just spent about an hour trying to solve this!
我只是花了大约一个小时试图解决这个问题！
回答by glasnt
Have you tried renaming the new version of your CSS to CSSv2.css and then directing your page to use that? If that solves the stale-file issue, then you're just experiencing non-refreshing files. If not, you've got bigger issues.
您是否尝试过将新版本的 CSS 重命名为 CSSv2.css，然后指示您的页面使用它？如果这解决了陈旧文件问题，那么您只是遇到了非刷新文件。如果没有，你有更大的问题。
