0

好的，所以我想要三个单独的 CSS 文件。一种适用于台式机和更大的笔记本电脑。一种用于横向 iPad。一个用于纵向 iPad。

当前的 CSS：

<link rel="stylesheet" media="all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape)" href="css/ipad-landscape.css" />
<link rel="stylesheet" media="all and (min-width: 1025px)" type="text/css" href="css/style.css" />

出于某种原因，当我检查 Screenfly 时，只加载了 style.css：http: //quirktools.com/screenfly/。当我将屏幕分辨率降低到上网本或 iPad 时，style.css 将停止使用，但 ipad-landscape.css（当屏幕处于横向时）未加载到位。目前，ipad-landscape.css 和 style.css 的内容是相同的，所以不可能有一个不起作用。是否可以使用多个 CSS 文件来区分屏幕大小？如果是这样，我该如何解决我的问题？

4

1 回答 1

0

首先，您应该只有一个 css 文件，而应该使用媒体查询。

其次，orientation:landscape是设备发送到浏览器的信息，我很确定 screenfly 只是一个用于查看样式的 iframe。像宽度/高度这样的东西会起作用，但检查方向不会。

尝试在 Xcode 中使用 iOS 模拟器进行测试（如果您使用的是 Mac OS X），或者在实际设备上进行测试，它应该可以工作。

于 2013-10-25T21:52:51.193 回答