logo标签列表

CSS在Internet Explorer中无法加载

htmlcssinternet-explorerweb
3

我正在学习HTML和CSS，并做一些简单的事情，比如在CSS中更改背景颜色。问题是，当我在Internet Explorer（IE 11）中加载页面时，没有任何变化显示出来。为了进一步测试，我在Google Chrome中加载了我的页面，它按预期显示。

这种情况已经发生过几次，我试图确保删除了Internet Explorer中的缓存，确定我正在编辑正确的文件以及CSS样式代码位于同一目录中。我确保进行了Crtl + R / Crtl F5刷新，但仍然无效。奇怪的是，在过去的几次加载之后，它会在我不做任何其他操作的情况下正常工作。

这是我要显示的内容：

HTML文件：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Lesson 12 - Fun With CSS Selectors</title>
  <link type="text/css" rel="stylesheet" href="styles.css" media="all">
</head>
<body>

<h1>Title of the page</h1>

<p>Lorem ipsum dolor sit amet ultricies. Nunc at aliquet nunc.</p>

</body>
</html>

CSS文件：

h1{
    font-size: 30em;
    font-weight: heavy;
    font-color: red;
    line-height: 10px;
}

body{
    background-color: red;
}

更新：

目前，在Internet Explorer 11中加载我的页面时，它现在具有来自样式CSS的更改，但我没有改变任何内容！ 我只是再次打开它...有人能解释一下发生了什么吗？因为这已经发生过多次。

h1标签中的字体颜色不会改变（可能是因为它不是这样做的方式），但在Google Chrome中背景颜色以及字体大小都会改变。 在Explorer中，它仍然是一个带有H1标签内容未更改的白色页面。 有人对发生了什么有什么想法吗？

你是在本地构建这个项目还是在服务器上？ - Liftoff
1
经常发生的情况是您的浏览器会缓存CSS文件以加快页面加载速度，需要一分钟左右才能意识到CSS文件已更改。您可以通过在URL末尾附加一个随机的GET变量来解决此问题，例如file.css?24798210。 - Liftoff
我正在本地运行这个程序。所以Google Chrome更快地更新CSS缓存，这就是为什么与IE相比，效果立即显现的原因？有没有办法在浏览器中更改此设置或者这需要进行代码更改？ - user3287645
6个回答
3
根据您的评论，看起来您在IE浏览器中遇到了缓存问题。
您可以尝试使用一些META关键字（如“pragma”和“expires”）指示浏览器不进行缓存。
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="-1"/>

请看这篇文章 - 所以你不想使用缓存，是吗？ 还有这个问题，建议使用这个跨浏览器方案：
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />

希望这可以帮到你！
指定no-cache或max-age = 0表示客户端可以缓存资源，并且必须在每次使用之前重新验证。因此，您只能使用其中之一。https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control无效日期（例如值0）表示过去的日期，并意味着该资源已经过期。因此，您也只能使用<meta http-equiv="expires" content="0" />https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Expires - Ivan Rascon
1
我们在使用Internet Explorer 11时遇到了这个问题，很奇怪，但是如果你将样式表重命名为任何不包含单词"style"的名称，它就会开始工作！只有在本地访问文件时才会出现这种情况，在Web服务器上似乎没有问题。
0
在我的情况下，HTML/CSS文件位于Google Drive目录中（我正在使用“虚拟驱动器”模式），将文件移出目录后立即生效。
0

我不知道是否还有人关注这个问题，但我也遇到了同样的问题。我正在开发一个django应用程序。我的CSS文件名为“style.css”，虽然谷歌浏览器的检查器告诉我它已经正确加载，但它对我的页面没有任何影响。我花费了很多时间才弄清楚，正如RayLau135上面提到的那样，你必须将CSS文件重命名为没有“style”的名称。当然，这不是一个解决方案，但确实是一个解决这个问题并节省大量时间和精力的方法。

0

将font-color替换为color。并尝试使用内联<style>body {background-color:#FF0000;} </style>，以查看样式表是否未正确加载。

0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接