代码片段 → CSS → iPad 方向 CSS iPad 方向 CSS Chris Coyier 于 2010 年 4 月 7 日 <link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css"> <link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">
这真的很棒,希望我有一个 iPad 可以试试它。
我还会添加更多查询。这将对 iPhone 产生相同的效果。
这正是我一直在寻找的 - 我认为你需要使用 JavaScript 根据方向应用一些样式非常荒谬。
需要注意的是,添加一个平台检查,如下所示
if(navigator.platform == 'iPad' || navigator.platform == 'iPhone') {
document.write("");
document.write("");
}
这样,除非平台匹配,否则它不会加载。
在“'” 的位置,放入上面列出的 LINK。 不确定为什么它们没有显示。 :-/
我不喜欢这个解决方案(抱歉!) - 尤其是因为一个构建良好的流体布局不需要做出这种区分。
现在许多设备都有本机纵向和横向模式,这不再仅仅是迎合 iPad;是物理宽度 - 而不是方向 - 才是最重要的。 如果 CSS 构建良好,@media 查询将无限更准确和高效。
:)