Question

我做了一个响应式网站，我在我的CSS中使用媒体查询。在chrome和FF上一切都很好看，但是ie10忽略了我的所有疑问。我在标题上有<meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">，因为该网站已设置为平板电脑。我试图删除元标记，但它没有解决问题。

我几乎尝试了一切：

@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) 
@media only screen and (max-width: 800px)
@media screen and (max-width: 800px)
@media all and (max-width: 800px)
@media (max-width:800px)

似乎没什么用。

Answer 1

您可能需要@ -ms-viewport {width：device-width;变焦：1.0; }

Answer 2

如果您有一个JSFiddle或示例链接以提供更好的示例，那会更好。 Jaynath提供了很好的建议。除了在手机上，IE忽略视口标记的FWIW。 ViewPort不是一个真正的标准，它是Android，Windows Phone等提供一些支持的Apple惯例。 @viewport规则是一个实际标准。

Answer 3

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    }

把你的东西放在这里，IE 10黑客不同于旧版本的IE。并在媒体查询中使用它

@-ms-viewport { width:device-width; zoom:1.0; }

媒体查询不适用于ie10

3 个答案: