mhe*_*abi 1 css internet-explorer-7 media-queries
我正在开发一个响应式模板并使用CSS媒体查询.但似乎IE7不直接支持媒体查询.所以我寻找解决方案,发现respond.js,
但我不能让它工作.
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="css/styles.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="js/respond.min.js"></script>
</head>
<body>
<!-- ... -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
CSS(style.css):
@import "reset.css";
@import "fonts.css";
@import "bootstrap.css";
@import "plugins.css";
@import "ui.css";
@media screen and (max-width: 320px) {
/* css */
}
Run Code Online (Sandbox Code Playgroud)
但是当我@media screen and (max-width: 320px) { }直接在我的HTML中包含它的工作时.那我错过了什么?
respond.js明确指出它不能解析通过@import包含的媒体查询
https://github.com/scottjehl/Respond
"Respond.js不通过@import解析CSS refrenced,也不用于样式元素中的媒体查询,因为这些样式无法重新请求解析."