如何使用Selectivizr在IE8中使波本整洁的网格工作？
如何使用Selectivizr在IE8中使波本整洁的网格工作？
提问于 2013-10-09 14:30:06
我有一项不幸的任务，就是让波旁威士忌与ie8齐头并进。Thoughtbot的医生说你用Selectivizr做这个。我按照Selectivizr的指示进行测试，在ie8中进行测试没有什么不同。我也不明白，如果需要任何回退css，怎么办？有什么想法或解决办法吗？非常感谢！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="description" content="">
<!-- FONTS -->
<!--Typekit - Adrianna Extended Demibold-->
<script type="text/javascript" src="//use.typekit.net/sjw4zgk.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<!-- AUTO RELOAD FOR HAMMER -->
<!-- Hammer reload -->
<script>
setInterval(function(){
try {
if(typeof ws != 'undefined' && ws.readyState == 1){return true;}
ws = new WebSocket('ws://'+(location.host || 'localhost').split(':')[0]+':35353')
ws.onopen = function(){ws.onclose = function(){document.location.reload()}}
ws.onmessage = function(){
var links = document.getElementsByTagName('link');
for (var i = 0; i < links.length;i++) {
var link = links[i];
if (link.rel === 'stylesheet' && !link.href.match(/typekit/)) {
href = link.href.replace(/((&|\?)hammer=)[^&]+/,'');
link.href = href + (href.indexOf('?')>=0?'&':'?') + 'hammer='+(new Date().valueOf());
}
}
}
}catch(e){}
}, 1000)
</script>
<!-- /Hammer reload -->
<!-- CSS/SCSS -->
<link rel='stylesheet' href='css/ostrich-sans.css'>
<link rel='stylesheet' href='css/font-awesome.css'>
<link rel='stylesheet' href='css/normalize.css'>
<link rel='stylesheet' href='css/responsive-nav.css'>
<link rel='stylesheet' href='css/style.css'>
<!-- IOS LINK STYLES -->
<style type="text/css">
/*.applelinks a {color:#c4d52d; display:inline-block; padding: 10px 0;}*/
/*Disable touch-highlight
-webkit-tap-highlight-color: rgba(0,0,0,0); */
</style>
<!-- JS MODERNIZR -->
<script src='js/modernizr.custom.87213.js'></script>
<link href="favicon.ico" rel="shortcut icon">
<link href="apple-touch-icon.png" rel="apple-touch-icon">
<title>Title</title>
<!-- ZEPTO FALLBACK TO JQUERY -->
<script>
document.write('<script src=' +
('__proto__' in {} ? 'js/zepto.min' : 'js/jquery.min') +
'.js><\/script>')
</script>
<!--[if lte IE 8]>
<script type="text/javascript" src="selectivizr.js"></script>
<![endif]-->
</head>
<body>
<header>
<nav class="nav-collapse">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
<section class="sec-one">
<aside>Aside</aside>
<article>Article</article>
</section>
<section class="sec-two">
<aside>Aside</aside>
<article>Article</article>
</section>
<section class="sec-three">
<aside>Aside</aside>
<article>Article</article>
<p>Content copy</p>
</section>
<script src='js/responsive-nav.js'></script>
<script src='js/app.js'></script>
<!-- INITIATE RESONSIVE-NAV -->
<script>
var navigation = responsiveNav(".nav-collapse", {
label: '<i class=\"icon-reorder icon-2x\"></i>'
});
</script>
</body>
</html>回答 2
Stack Overflow用户
回答已采纳
发布于 2013-10-29 17:30:24
selectivizr.js依赖于jquery (或类似的库)。确保您在加载jquery 之前，selectivizr。
<!--[if lte IE 8]>
**<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>**
<script type="text/javascript" src="selectivizr.js"></script>
<![endif]--> Stack Overflow用户
发布于 2014-03-25 13:07:31
你试过包括HTML5志贺器吗
如果没有这些(或类似的)，IE8将无法对HTML5中新的元素进行样式化(例如。<section>、<nav>等)。对我来说，selectivizr.js确实允许使用IE8，但是如果您使用的是HTML5元素，那么即使使用selectivizr.js，也无法在没有HTML5 shiv的情况下在IE8中对它们进行样式化。(注：这实际上并不是一个整洁本身的问题-它是一个更普遍的问题，起源于IE8是一个前HTML5 5浏览器)。
实际上，selectivizr.js解决了IE8不认识的选择器的问题，而HTML5 shiv用未识别的元素解决了问题:如果您使用HTML5元素，那么为了使一切顺利运行，您可能需要两者兼而有之。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19274908
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号