这是一个奇怪的问题,我已经花了3天进行故障排除。
只发生在Windows上的Chrome Version 53.0.2785.116 m (64-bit)
浏览器中。
Web服务器必须设置标题(元标记在这种情况下不起作用):
Apache的.htaccess: Header set Cache-Control "no-cache"
或nginx: add_header Cache-Control no-cache;
您无法使用jsfiddle或内置代码段来重新创建它,因为必须使用<link href='style.css' rel='stylesheet' type='text/css'>
单独加载css文件。(但我仍将在片段中包含代码)。
重现步骤:
- 访问:http://test.xmpsoft.net/
- 点击链接1(应重新加载页面);
- 点击链接2(应打开新标签,显示相同的页面);
- 切换回原始标签并重复相同的步骤;
- 原始标签中的所有CSS样式都消失了。
- 如果没有,请再次重复相同的步骤。
在提交给Google之前,请协助确保代码没有任何问题。
谢谢。
P.S. 还有另一种重现它的方法(这就是我在标题中提到“新窗口”的原因):访问相同的页面,重新加载它,右键单击 ->检查(打开新的开发工具窗口),切换回页面(如果无法重现,请重复)。
.menu div {
display: inline-block;
width: 15em;
height: 15em;
}
.red {
background-color: red;
}
.yellow {
background-color: yellow;
}
.green {
background-color: green;
}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<title>Chrome bug</title>
<link href='style.css' rel='stylesheet' type='text/css'>
</head>
<body>
<div class='menu'>
<div class='red'>Red</div>
<div class='yellow'>Yellow</div>
<div class='green'>Green</div>
</div>
<a href='/'>1. Reload this page</a><br>
<a href='/' target='_blank'>2. Open same page in new tab</a>
</body>
</html>