/* 判断ipad */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px){
/* style */
}
/* ipad横屏 */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape){
/* style */
}
/* ipad竖屏 */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait){
/* style */
}
/* 判断iphone5 *//* 横屏竖屏判断方法与ipad一样 */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px){
/* style */
}

  

/* 判断iphone4-iphone4s *//* 横屏竖屏判断方法与ipad一样 */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
/* style */
}
/* iphone5分辨率 */
screen Width = 320px (css像素)
screen Height = 568px (css像素)
screen Width = 640px (实际像素)
screen Height = 1136px (实际像素)
Device-pixel-ratio:2
/* iphone4-iphone4s分辨率 */
screen Width = 320px (css像素)
screen Height = 480px (css像素)
screen Width = 640px (实际像素)
screen Height = 960px (实际像素)
Device-pixel-ratio:2

  

媒体查询判断ipad和iPhone各版本的更多相关文章

  1. 媒体查询判断ipad与iPhone各版本i

    /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ /* s ...

  2. JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)

    在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法. 代码如下: function ...

  3. 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏的代码

    在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法 其实主要是通过window.or ...

  4. 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏

    function orient() {if (window.orientation == 90 || window.orientation == -90) {//ipad.iphone竖屏:Andri ...

  5. [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者landscape

    //判断横屏或者竖屏 function orient() { //alert('gete'); if (window.orientation == 0 || window.orientation == ...

  6. 运用CSS3媒体查询判断iPhoneX、iPhoneXR、iPhoneXS MAX及横竖屏

    //iphoneX.iphoneXs @media only screen and (device-width: 375px) and (device-height: 812px) and (-web ...

  7. css3媒体查询判断移动设备横竖屏

    /* 设备竖屏时调用该段css代码 */ @media all and (orientation : portrait){ body{   background-color:blue;  } } /* ...

  8. 媒体查询ipad,pc端

    媒体查询 /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ ...

  9. 媒体查询(pc端,移动端不同布局)

    媒体查询语法: 1.内联写法:and之后必须有空格@media screen and (min-width:960px //判断浏览器大小条件){body{background:red} //常规的样 ...

随机推荐

  1. #ifndef _LED_H #endif啥意思?

    #ifndef _LED_H#ifndef _LED_H ...... ...... #endif 避免重复引用头文件的内容.

  2. cefsharp设置网页接受语言Accept-Language

    1.设置浏览器的请求控制器 webView.RequestHandler = new RequestHandler(); 2.新建RequestHandler类继承IRequestHandler接口, ...

  3. [麦先生]TP3.2之微信开发那点事[基础篇](获取access_token)

    在微信文档中一共提供了两个access_token:一个是伪全局配置的Access_token;一个是在微信网页授权时的小Access_token 很多刚刚接触微信开发的人经常会混淆这两个的作用: 我 ...

  4. 用CSS开启硬件加速来提高网站性能

    国外一篇文章,有点意思,转载过来,准备尝试下~ 中文地址:http://www.cnblogs.com/rubylouvre/p/3471490.html 原文地址:http://blog.teamt ...

  5. backbone学习总结(二)

    今天来看下backbone的路由控制的功能.其实个人感觉backbone,模块就那么几个,熟悉它的框架结构,以及组成,就差不多. 废话不多说,我们来看看还剩下的功能. 关于路由和历史管理 通过 Bac ...

  6. HDU2767Proving Equivalences[强连通分量 缩点]

    Proving Equivalences Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  7. java发送email

    package com.assess.util; import java.io.File; import java.util.ArrayList; import java.util.List; imp ...

  8. 一段拼装sql的小代码

    /** * 单表查询 * * className:实体类的名字 * vals:查询的属性 * pNames:条件的名字 * pVals:条件的值 */ @Override public List< ...

  9. 用Access为支撑,书写一个用C#写入数据库的案列

    /// <summary> /// 读取Excel文档 /// </summary> /// <param name="Path">文件名称&l ...

  10. SQL笔记

    1.增加.删除约束 ALTER TABLE 表名 ADD CONSTRAINT 约束名 UNIQUE(列1名,列名2) ALTER TABLE 表名 DROP CONSTRAINT 约束名 2.查询更 ...