Question

我使用的是modernizer.js＆amp; respond.js在IE8上实现媒体查询。

我编写了我的页面（HTML和Javascript），例如：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Modernizr test page</title>
    <style type="text/css" media="all">
        @media (max-width: 500px) {
            body {
            background-color: blue;
            }
        }
    </style>
  </head>
  <body>
    Modernizr test page<br>

    <script src="modernizr.custom.js"></script>
    <script>
        Modernizr.load({
            test: Modernizr.mq('only all'),
            nope: '//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js'
        });
    </script>
    </body>
</html>

它不起作用。

然后我将代码更改为：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Modernizr test page</title>
    <link rel="stylesheet" href="myStylesheet.css">
  </head>
  <body>
    Modernizr test page<br>

    <script src="modernizr.custom.js"></script>
    <script>
        Modernizr.load({
            test: Modernizr.mq('only all'),
            nope: '//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js'
        });
    </script>
    </body>
</html>

另外一个CSS文件“myStylesheet.css”：

@media (max-width: 500px) {
    body {
        background-color: blue;
    }
}

它有效。

我快速浏览了respond.js Github page，但找不到任何关于内部样式表引用不被支持的内容。

我错过了什么吗？

Answer 1

似乎我们必须在内部或外部任何样式之后连接respond.js。然后它应该工作！

可以response.js处理内部样式表

1 个答案: