我正在开发网站。除了没有一个 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;
}
最佳答案
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 应该有助于兼容性。
关于html - CSS 不会在 IE8 上加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17599868/