我的 CSS 没有在 Internet Explorer 11 和 Firefox 中加载！仅适用于 Chrome

Question

Im creating a simple webpage.我正在创建一个简单的网页。 My CSS is only working in Chrome.我的 CSS 仅适用于 Chrome。 It doesnt work in both Firefox and IE11.它不适用于 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.我对 CSS 但和 HTML 很陌生。 It works prefectly fine in Chrome which leads me to wonder what the problem is.它在 Chrome 中运行良好，这让我想知道问题是什么。 My Problem is that none of the css loads and that all images and text are not aligned.我的问题是没有任何 css 加载，并且所有图像和文本都没有对齐。 I do not even have anycolours我什至没有任何颜色

Answer 1

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.希望有帮助。

Answer 2

通过在导入样式type="css/stylesheet"时使用type="text/css"而不是type="css/stylesheet" 。

Answer 3

for internet explorer add this对于 Internet Explorer 添加此

 <!--[if lt IE 9] < script src = "//html5shiv.googlecode.com/svn/trunk/html5.js" > < /script> <![endif]-->

Answer 4

It can be because of browser cache.这可能是因为浏览器缓存。 Please clear browser cache by CTRL + F5请按CTRL + F5清除浏览器缓存

Answer 5

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).不知何故，如果您在本地运行页面（如在浏览器中独立运行），IE 不会加载 CSS。 I uploaded the exact same script to a webserver and it works like a charm!我将完全相同的脚本上传到网络服务器，它的工作原理非常棒！

Answer 6

msvk_23 is right. msvk_23 是对的。 I had a local html page, instead of post-it.我有一个本地 html 页面，而不是 post-it。 After I have installed Notepad++ it was all messed up in Internet Explorer and Edge, but not in Google Chrome.在我安装 Notepad++ 之后，它在 Internet Explorer 和 Edge 中都搞砸了，但在 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.检查注册表时，它说： text/xml 按照建议将其更改为 text/css 后，它立即在 Internet Explorer 和 Edge 中工作。

Thanks msvk_23 :)谢谢 msvk_23 :)

pic of regedit regedit 的图片

Answer 7

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.对我来说，在 IE 11 中根本无法识别 css。通过在 regedit 中更改此条目。 It perfectly worked in my PC.它在我的电脑上完美运行。

我的 CSS 没有在 Internet Explorer 11 和 Firefox 中加载！仅适用于 Chrome

问题描述

7 个解决方案

解决方案1
6 2014-07-23 15:26:38

解决方案2
4 已采纳 2016-12-20 14:52:47

解决方案3
1 2015-10-17 11:08:25

解决方案4
0 2016-05-10 14:19:47

解决方案5
0 2017-04-22 19:11:04

解决方案6
0 2019-01-24 06:42:44

解决方案7
-4 2016-08-11 06:33:56

我的 CSS 没有在 Internet Explorer 11 和 Firefox 中加载！ 仅适用于 Chrome

问题描述

7 个解决方案

解决方案1 6 2014-07-23 15:26:38

解决方案2 4 已采纳 2016-12-20 14:52:47

解决方案3 1 2015-10-17 11:08:25

解决方案4 0 2016-05-10 14:19:47

解决方案5 0 2017-04-22 19:11:04

解决方案6 0 2019-01-24 06:42:44

解决方案7 -4 2016-08-11 06:33:56

我的 CSS 没有在 Internet Explorer 11 和 Firefox 中加载！仅适用于 Chrome

解决方案1
6 2014-07-23 15:26:38

解决方案2
4 已采纳 2016-12-20 14:52:47

解决方案3
1 2015-10-17 11:08:25

解决方案4
0 2016-05-10 14:19:47

解决方案5
0 2017-04-22 19:11:04

解决方案6
0 2019-01-24 06:42:44

解决方案7
-4 2016-08-11 06:33:56