Html 我的 CSS 没有在 Internet Explorer 11 和 Firefox 中加载！仅适用于 Chrome
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24914190/
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
My CSS is not loading in Internet Explorer 11 and Firefox! Only works with Chrome
提问by malteser
Im creating a simple webpage. My CSS is only working in Chrome. It doesnt work in both Firefox and IE11.
我正在创建一个简单的网页。我的 CSS 仅适用于 Chrome。它不适用于 Firefox 和 IE11。
Here's my HTML
这是我的 HTML
<html>
<head>
<title>text</title>
<link href="css/stylesheet.css" type="css/stylesheet" rel="stylesheet" media="all"/>
</head>
<body>
<h1><b><u>Adding a new Visitor</u></b></h1><br/></br>
<div class="wrapper">
<figure>
<img src="images/advis1.png"/>
<figcaption style="padding-top: 12px;">text</figcaption>
</figure>
<hr/>
<figure>
<img src="images/advis2.png"/>
<figcaption style="padding-top: 12px;">text</figcaption>
</figure>
<hr/>
<figure>
<img src="images/advis3.png"/>
<figcaption style="padding-top: 12px;">text.</figcaption>
</figure>
<hr/>
<h3><u>Result</u></h3>
<img src="images/advis4.png"/>
<br/>
<img src="images/advis5.png"/>
</div>
<footer>
Author: Malcolm Tanti | Contact information: <a href="mailto:xxx">xxxxm</a>
</footer>
</body>
And here is my CSS
这是我的 CSS
h1 {
text-align: center;
border-bottom: double;
border-left: double;
border-right: double;
width: 75%;
margin: 0 auto;
padding-top: 25px;
padding-bottom: 25px;
background-color: #C4CEDD;
box-shadow: inset 0 20px 20px -20px #000000;
}
body {
padding:0px;
margin:0px;
border:none;
background-color: #7ea2d6;
font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
}
.wrapper {
box-shadow: inset 0 20px 20px -20px #000000;
border: double;
padding-top: 50px;
padding-bottom:50px;
width: 75%;
margin: 0 auto;
text-align: center;
font-size: 20px;
background-color: #C4CEDD;
}
img {
border:3px double;
display: block;
margin: 0 auto;
}
footer {
padding-top: 10px;
text-align: center;
font-size: 14px;
}
I am quite new to CSS but and HTML. It works prefectly fine in Chrome which leads me to wonder what the problem is. My Problem is that none of the css loads and that all images and text are not aligned. I do not even have anycolours
我对 CSS 但和 HTML 很陌生。它在 Chrome 中运行良好，这让我想知道问题是什么。我的问题是没有任何 css 加载，并且所有图像和文本都没有对齐。我什至没有任何颜色
回答by Juan
I tested your code and found that if you remove type="css/stylesheet" from:
我测试了您的代码，发现如果您从以下位置删除 type="css/stylesheet" ：
<link href="css/stylesheet.css" type="css/stylesheet" rel="stylesheet" media="all"/>
so it looks like:
所以它看起来像：
<link href="css/stylesheet.css" rel="stylesheet" media="all">
You also don't need the closing / at the end.
您也不需要在结尾处关闭 / 。
It fixes the issue. (Tested on standards mode not quirks)
它解决了这个问题。（在标准模式下测试而不是怪癖）
And you shouldn't need to do this:
你不应该需要这样做：
<h1><b><u>Adding a new Visitor</u></b></h1><br/></br>
The underline, font-weight and spacing (margin/padding) should be done in your CSS:
下划线、字体粗细和间距（边距/填充）应该在你的 CSS 中完成：
<h1>Adding a new Visitor</h1>
h1 {
text-align: center;
border-bottom: double;
border-left: double;
border-right: double;
width: 75%;
margin: 0 auto;
padding-top: 25px;
padding-bottom: 25px;
background-color: #C4CEDD;
box-shadow: inset 0 20px 20px -20px #000000;
text-decoration: underline;
font-weight: bold;
}
Hope that helps.
希望有帮助。
回答by malteser
Solved by using type="text/css"instead of type="css/stylesheet"when importing the stylesheet.
通过在导入样式表时使用type="text/css"而不是解决type="css/stylesheet"。
回答by Segun Michael Oroyo
for internet explorer add this
对于 Internet Explorer 添加此
<!--[if lt IE 9]
< script src = "//html5shiv.googlecode.com/svn/trunk/html5.js" > < /script>
<![endif]-->回答by Sanjay Sharma
It can be because of browser cache. Please clear browser cache by CTRL + F5
这可能是因为浏览器缓存。请按CTRL + F5清除浏览器缓存
回答by Loungy
I had the same problem and none of the above fixed my issue. In my case, in the end, the solution was simple:
我遇到了同样的问题，以上都没有解决我的问题。就我而言，最终的解决方案很简单：
Somehow IE doesn't load the CSS if you are running the page locally (as in stand-alone in your browser). I uploaded the exact same script to a webserver and it works like a charm!
不知何故，如果您在本地运行页面（如在浏览器中独立运行），IE 不会加载 CSS。我将完全相同的脚本上传到网络服务器，它的工作原理非常棒！
回答by Peter
msvk_23 is right. I had a local html page, instead of post-it. After I have installed Notepad++ it was all messed up in Internet Explorer and Edge, but not in Google Chrome. When checking registry it said: text/xml After changing this to text/css as suggested, it worked immediately in both Internet Explorer and Edge.
msvk_23 是对的。我有一个本地 html 页面，而不是 post-it。在我安装 Notepad++ 之后，它在 Internet Explorer 和 Edge 中都搞砸了，但在 Google Chrome 中却没有。检查注册表时，它说： text/xml 按照建议将其更改为 text/css 后，它立即在 Internet Explorer 和 Edge 中工作。
Thanks msvk_23 :)
谢谢 msvk_23 :)
pic of regedit
regedit 的图片
回答by msvk_23
Try this option:
试试这个选项：
Please run regedit.exe and navigate to the key HKEY_LOCAL_MACHINE\SOFTWARE\Classes.css
请运行 regedit.exe 并导航到 HKEY_LOCAL_MACHINE\SOFTWARE\Classes.css 键
Modify: "Content Type" from "text/plain" to "text/css"
修改：“内容类型”从“text/plain”改为“text/css”
For me the css was not at all recognizing in IE 11. By changing this entry in regedit. It perfectly worked in my PC.
对我来说，在 IE 11 中根本无法识别 css。通过在 regedit 中更改此条目。它在我的电脑上完美运行。
