让ie8,7,6更好的支持css3,媒体查询和html5

难道我们还在乎ie8,7,6？我个人觉得越来越要忽略了。但ie8还是有一些人支持在使用的。

有三个脚本可以帮助你支持他们，他们补充了现代的一些东西，例如响应式设计，css3伪类和属性选择器以及html5的标签。为这些提供了更好的兼容性。

在浏览器小于IE9的情况下，我们可以在我们的主题加载下面这些js.

• html5shiv.js (source) – HTML5 支持
• selectivizr.js (source) – css伪类支持 (eg :last-child)
• respond.js (source) – 媒体查询支持

那我们应该如何加载这些js呢？我们需要加载这个respond.js在主题的底部，而htmlshiv.js和selectivizr.js则在主题的顶部。下面的代码可以直接加载function.php里面。

/*  IE js header
/* ------------------------------------ */
function alx_ie_js_header () {
echo '<!--[if lt IE 9]>'. "n";
echo '<script src="' . esc_url( get_template_directory_uri() . '/js/ie/html5shiv.js' ) . '"></script>'. "n";
echo '<script src="' . esc_url( get_template_directory_uri() . '/js/ie/selectivizr.js' ) . '"></script>'. "n";
echo '<![endif]-->'. "n";
}
add_action( 'wp_head', 'alx_ie_js_header' );

/*  IE js footer
/* ------------------------------------ */
function alx_ie_js_footer () {
echo '<!--[if lt IE 9]>'. "n";
echo '<script src="' . esc_url( get_template_directory_uri() . '/js/ie/respond.js' ) . '"></script>'. "n";
echo '<![endif]-->'. "n";
}
add_action( 'wp_footer', 'alx_ie_js_footer', 20 );

这样子，我们就可以解决在IE8甚至更低版本浏览器下的更好的浏览器支持了。