Internet Explorer 11 未加载外部 CSS答案

【问题标题】：Internet Explorer 11 not loading external CSSInternet Explorer 11 未加载外部 CSS
【发布时间】：2017-09-22 15:18:34
【问题描述】：

我正在尝试制作一个允许用户输入一些数据的小型网络实用程序。它有一个外部样式表。样式表在 Firefox 和 Chrome 中正确加载，但在 IE 11 中不加载。我已经通过 W3C 验证器运行了 CSS 和 HTML，一切似乎都很好。我查看了所有与此问题类似的帖子，但仍然遇到问题。任何建议将不胜感激。下面是 HTML 和 CSS。我不是网页设计师，所以我的 HTML 和 CSS 有点生疏:)。我还删除了 javascript，因为该功能有效。它只是显示 CSS 不会在 IE 11 中加载。

#colA {
	width: 50%;
	float: left;
	max-width: 480px;
}


.userInputs {
	width: 90%;
	float: left;
}

#right {
	padding-top: 20px;
	float: left;
}

#userDisplay {
	width: 90%;
	float: left;
}

/* Styling for the Name/Value Pair List */
#listDisplay {
	min-width: 90%;
	float: left;
	height: 200px;
}


/* Styling for all  buttons */
.buttons {
	margin-bottom: 20px;
}

<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Dundas Data Test</title>
	<link href="dundas.css" type="text/css" rel="stylesheet">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="vkbeautify.js"></script>
</head>
<body onLoad="reset()">
    <div>
        <div>
       		<header>
        		<h1>Test</h1>
      		</header>
            <div id="colA">
                <label class="userInputs">Name/Value Pair</label><br>
                <input id="userInput" class="userInputs" type="text" ><br>
                <label class="userInputs">Name/Value Pair List</label><br>
                <select size="10" multiple id="listDisplay"></select>
            </div>
            <div id="right">
                <button class="buttons" type="button" onClick="addToList()">Add</button><br>
                <button class="buttons" type="button" onClick="sortByName()">Sort by Name</button><br>
                <button class="buttons" type="button" onClick="sortByValue()">Sort by Value</button><br>
                <button class="buttons" type="button" onClick="deleteItem()">Delete</button><br>
                <button class="buttons" type="button" onClick="createXML()">Show XML</button>         
            </div>
        </div>
    </div>
</body>
</html>

【问题讨论】：

标签： html css internet-explorer

【解决方案1】：

使用指向 CSS 文件的绝对域链接，以 / 开头 - 这是基本目录。

例如，如果您的文件位于 /myfile/ 目录中，请尝试使用：/myfile/dundas.css 作为 CSS 的 URL。

【讨论】：

谢谢马丁。但是我尝试过使用绝对链接，但仍然是同样的问题。我也试过./
如果你能给我一个页面的 URL，我可以看看 - 我现在没有想法，我自己也没有看到问题。干杯@sunpack
如果您查看 IE11 上的菜单，您会发现开发人员工具 (F12)，它应该可以指示问题所在。 . .
我使用了开发者工具，IE 可以看到 CSS，但没有应用样式。没有错误指示为什么不应用样式。当我使用 <style> 标签将 CSS 插入我的 HTML 时，它可以工作。我不知道为什么。 Firefox 和 Chrome 的外部样式表没有问题

【解决方案2】：

在尝试解决相同问题时发现了这个问题。根据this answer 删除<!DOCTYPE html> 解决了我的问题。

【讨论】：