CSS不会在IE8上加载
[英]CSS wont load on IE8
问题描述
我正在开发网站。 事实证明，css在IE8上均不起作用。 我一直在网上阅读，在理解提供解决方案的各种指南和技巧时遇到了一些麻烦。 关于如何使它开始工作的任何建议？ 这是一段代码来提供帮助。 谢谢！
<!DOCTYPE html>
<html>
<head style="overflow-x: hidden">
<script src="//cdn.optimizely.com/js/272026200.js"></script>
<meta name="viewport" content="width=device-width">
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="ie8.css">
<![endif]-->
<title>Dupont Studios</title>
<link href='http://fonts.googleapis.com/css?family=Oxygen:300' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script type="text/javascript" src="waypoints.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" media="only screen and (max-width: 400px)" href="mobile.css" />
<link rel="stylesheet" media="only screen and (min-width: 401px)" href="style.css" />
<script language="javascript" type="text/javascript">
$(function() {
// Do our DOM lookups beforehand
var nav_container = $(".nav-container");
var nav = $("nav");
nav_container.waypoint({
handler: function(direction) {
nav_container.toggleClass('sticky', direction=='down');
}
});
$("li.nav-item").click(function() {
$("html, body").animate({
scrollTop: $($(this).children().attr("href")).offset().top + "px"}, {duration: 500, easing: "swing"
});
return false;
});
});
</script>
</head>
更多信息：ie8.css表只是我作为测试生成的style.css的副本。 我在网上某处看到以\\ 9结尾可以有所帮助。 这是代码片段。 回想起来，这似乎很愚蠢
body{
font-family: 'Helvetica Neue', 'Helvetica Neue Light', sans-serif\9;
margin:0\9;
}
#top-container{
width:100%\9;
height:100%\9;
}
#top-content{
max-width:1200px\9;
margin-right:auto\9;
margin-left:auto\9;
}
#top-img{
width:100%\9;
padding-bottom: 10%\9;
}
5 个解决方案
解决方案1
2 已采纳 2013-07-11 18:12:19
IE 8及更低版本仅在media属性中响应screen和print 。
更改此：
<link rel="stylesheet" media="only screen and (max-width: 400px)" href="mobile.css" />
对此：
<link rel="stylesheet" media="screen" href="mobile.css" />
并将媒体查询添加到您的CSS文件中：
@media screen and (max-width: 400px) {
body {
...
}
..
}
正如其他人指出的那样，Respond.js应该有助于兼容性。
解决方案2
1 2013-07-11 17:39:07
IE8（或者，特别是IE9之前的任何IE版本）不完全支持CSS3媒体查询，这就是为什么无法加载mobile.css和style.css样式表的原因。
解决方案3
0 2013-07-11 17:42:09
如果需要在IE8上运行CSS3媒体查询，则应使用responsejs ：
快速，轻量的polyfill，可用于最小/最大宽度的CSS3媒体查询（适用于IE 6-8等）
解决方案4
0 2015-01-26 17:40:36
另一个建议-我将首先加载默认样式表，然后再声明条件IE样式表。 想法是使用该条件样式表覆盖默认样式表中的某些内容，因此您不必在任何地方放置！important声明。 因此，“级联”
解决方案5
-1 2013-07-11 17:42:18
如果只是没有加载ie8样式表，请注意，如果IE在兼容性视图中运行，它将标识为IE7。 因此，您的条件注释将不适用，并且永远不会包含ie8.css样式表。
谷歌地图不会在IE8中加载
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.