ipad iphone横屏竖屏

iPad是四方型的，应该是可以划分横向和竖向的，那就像怎样让ipad自己能够在从横向变到竖向时，css发生变化呢。经过多方查证media="all and (orientation:portrait)"可以判断出屏幕处于竖向，media="all and (orientation:landscape)"可以判断出屏幕处于横向，知道了这两种就可以更换css了，在head里写入下列两行就能实现css切换了。

iPad直接使用了媒体查询中的orientation属性 :

<link rel="stylesheet" type="text/css" media="all and (orientation:portrait)" href="css/text.css" />
<link rel="stylesheet" type="text/css" media="all and (orientation:landscape)" href="css/text1.css" />

在打开页面后，两个手指同时相向或相离时，页面和变大或缩小，这样用户体验就不好了，在head里加上

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">

 对于CSS3的媒体（media）查询，iPhone和iPad是不同的。

iPhone是通过屏幕最大宽度来侦测的：

<link rel="stylesheet" media="screen and (max-width: 320px)" href="portrait.css" />  
<link rel="stylesheet" media="screen and (min-width: 321px)" href="landscape.css" />