0

我正在使用以下在 IE7 中不起作用的内容。

<!-- styles to use for small screens, such as phones -->
<link rel="stylesheet" media="screen and (max-width:480px)" href="phone.css">

<!-- styles to use for medium screens, such as tablets -->
<link rel="stylesheet" media="screen and (min-width:481px) and (max-width:800px)" href="tablet.css">

<!-- styles to use for larger screens, such as desktops and laptops -->
<link rel="stylesheet" media="screen and (min-width:801px)" href="styles.css">

我想知道为什么这在IE7中不起作用?有没有办法在一个样式表中完成这一切......这将在 IE 中工作?

谢谢

我最终这样做了,以便将 IE8(及以下)直接驱动到我的标准样式表:

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="styles.css" />
<![endif]-->

<!--[if lte IE 8]>
<link rel="stylesheet" type="text/css" href="styles.css" />
<![endif]-->

<!-- styles to use for small screens, such as phones -->
<link rel="stylesheet" media="screen and (max-width:480px)" href="phone.css">

<!-- styles to use for medium screens, such as tablets -->
<link rel="stylesheet" media="screen and (min-width:481px) and (max-width:800px)" href="tablet.css">

<!-- styles to use for larger screens, such as desktops and laptops -->
<link rel="stylesheet" media="screen and (min-width:801px)" href="styles.css">
4

2 回答 2

0

我认为您的“代码”没有正确粘贴。

另外,我假设您正在尝试对 IE 使用媒体查询。IE 不支持媒体查询并且不会读取它们。它基本上会跳过它们。

现在,您可以使用像 respond.js 这样的库。从它的描述来看:

“用于最小/最大宽度 CSS3 媒体查询的快速轻量级 polyfill(适用于 IE 6-8 等)” Respond.js 页面

于 2012-06-06T15:02:33.500 回答
0

您可以将部分 CSS 代码设置为特定于浏览器。

此页面包含有关如何执行此操作的信息!

于 2012-06-06T15:31:27.943 回答