Question

我有一个具有以下CSS样式的网页，它覆盖了一些更高级别的样式。

#pnlActions { 
    background-image: -webkit-gradient(linear,left top,left bottom,from(#000),to(#000));
    background-image: -webkit-linear-gradient(#000,#000);
    background-image: -moz-linear-gradient(#000,#000);
    background-image: -ms-linear-gradient(#000,#000);
    background-image: -o-linear-gradient(#000,#000);
    background-image: linear-gradient(#000,#000);               
}

奇怪的是，我第一次加载页面时，样式完全被忽略，直到我刷新页面 - 然后应用样式。然后我将退出浏览器，再次加载页面并且不再应用样式（直到我刷新页面）。

我可以通过chrome / firefox / ie浏览器工具告诉所有这些。

我完全无法解释为什么会这样。有任何想法吗？

Answer 1

尝试将以下php代码附加到标头中的.css文件中。您的文件必须具有.php扩展名才能生效。

<link rel="stylesheet" type="text/css" media="screen" href="your.css?<?php echo time(); ?>" />

这将排除样式表的缓存。

Answer 2

如果您在Chrome DevTools已关闭的情况下加载页面，请打开DevTools，然后刷新页面，然后您有setting＆＃34;禁用缓存（当DevTools处于打开状态时）＆＃34;检查，这可以解释你的经验。

Answer 3

几年后，但这就是我解决的方式。

出于某种原因，只有在刷新后才能在HEAD标记（内部CSS）中使用STYLE。

但是将其添加为LINK（外部CSS）可以解决该问题。现在，它可以从第一次运行开始工作。

我在CSS内添加了！IMPORTANT到样式中，因为我需要像OP一样覆盖其他一些元素。

对于对如何添加内部或外部CSS有疑问的人，请选中此link。

Answer 4

检查您的＆lt; head＆gt;内是否没有添加内容在引用样式表之前。

我在使用IE9的Win7盒子上遇到了同样的问题;也就是说，直到我刷新才会应用我的样式。在我使用IE8的XP机器上没有出现问题;样式在初始加载时应用。

其他信息，可能会有所帮助：作为母版的新手，我跟随着“Beginning ASP.Net 4”。该示例让您在＆lt; head＆gt;中添加ContentPlaceHolder。就在链接到样式表之前（第200页，第4步）。示例CPH为空。然后他们将你的asp：Content ID =“Content1”...添加到你的ASPX上。 203.我在此标记中放入了“Content1”，它将“Content1”放在浏览器输出中的样式表链接之前。这不在说明书中，我看到它是否会在浏览器中显示（确实如此）。我一直都在刷新，所以直到很久以后才会出现仅适用于样式表的应用样式表问题。删除我的ASPX上的'Content1'修复了问题 - 也许其他一些大师可以告诉我们为什么IE9（但不是IE8）停止处理＆lt; head＆gt;内容在初始加载时遇到问题，但在刷新时没有问题。

希望这可以解决您的问题！

Answer 5

我刚刚解决了同样的问题。

当我收到错误时，我的代码看起来像这样:(简化以省略-webkit -moz等）

<div style="width: 100%; background: linear-gradient(to bottom, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), url('relativePathToImg.png') repeat 0 0;">

我所做的是使用chrome dev工具，检查div然后选择“Computed”选项卡，而不是“Styles”选项卡。我注意到chrome计算了css：

background-image: linear-gradient(rgba(255, 255, 255, 0.701961) 0%, rgba(255, 255, 255, 0.2) 100%), url(http://mywebsite.com/);

由于未知原因，相对网址被转换为网站根网址，因此css正在查找错误网址的图片。然后我将“relativePathToImg.png”替换为图像的绝对路径。这解决了我的问题。

我注意到您没有在上面的代码中明确列出图像，但是您说的样式应用于其他地方。看一下开发工具中的“计算”选项卡，看看到底发生了什么。

CSS样式直到刷新才会应用

5 个答案: