html5 ipad 和iphone 响应式的问题。 为什么根据iphone设置的css 不好使。

渔樵耕读 发布于 2013/07/05 14:47
阅读 1K+
收藏 0
<!-- 手机 竖屏 CSS -->
	<link rel="stylesheet" type="text/css" media="only screen and (max-width:320px)" href="css/iphone_vertical.css" />
	<!-- 手机 横屏 CSS -->
	<link rel="stylesheet" type="text/css" media="only screen and (min-width:321px)" href="css/iphone_horizontal.css" />
	<!-- IPAD 竖屏 CSS -->
	<link rel="stylesheet" type="text/css" media="screen and (orientation:portrait)" href="css/ipad_vertical.css" />
	<!-- IPAD 横屏 CSS -->
	<link rel="stylesheet" type="text/css" media="screen and (orientation:landscape)" href="css/ipad_horizontal.css" />

在页面加入了 上面四个css 判断

为什么我用iphone访问页面的时候。 相应的css 不起作用。自动展示了针对ipad的样式。导致背景图显示不全 都出血跑到屏幕外了!

我如果把ipad 的两个css  去掉 那么iphone的css 就可以正常显示。 why?

是我css的判断media写的不对么?

求解决。。

加载中
0
undefined_
undefined_
给iPad的css media query也加上min-width 和 max-width的限制,不然后面的两条css就会覆盖前面两条
0
渔樵耕读
渔樵耕读
啊啊啊啊啊啊 求关注啊!
0
undefined_
undefined_
或者试试把 iPad 的样式放在 iPhone 的前面
渔樵耕读
渔樵耕读
回复 @若即若离嘿嘿嘿 : 好的 非常感谢你!
undefined_
undefined_
回复 @渔樵耕读 : 如果你不区分普通iPad和 retina iPad,用 1024 x 768 的分辨率就行了,这样保证 iPhone 不会中这些 query
渔樵耕读
渔樵耕读
听着貌似可行。 周一上班试验下。 另外能提高下 ipad 的 min 和max width 么? 怎么我在网上找到 都不统一呢。。
返回顶部
顶部