媒体查询判断ipad和iPhone各版本
/* 判断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各版本的更多相关文章
- 媒体查询判断ipad与iPhone各版本i
/* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ /* s ...
- JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法. 代码如下: function ...
- 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏的代码
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法 其实主要是通过window.or ...
- 基于jQuery的判断iPad、iPhone、Android是横屏还是竖屏
function orient() {if (window.orientation == 90 || window.orientation == -90) {//ipad.iphone竖屏:Andri ...
- [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者landscape
//判断横屏或者竖屏 function orient() { //alert('gete'); if (window.orientation == 0 || window.orientation == ...
- 运用CSS3媒体查询判断iPhoneX、iPhoneXR、iPhoneXS MAX及横竖屏
//iphoneX.iphoneXs @media only screen and (device-width: 375px) and (device-height: 812px) and (-web ...
- css3媒体查询判断移动设备横竖屏
/* 设备竖屏时调用该段css代码 */ @media all and (orientation : portrait){ body{ background-color:blue; } } /* ...
- 媒体查询ipad,pc端
媒体查询 /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ ...
- 媒体查询(pc端,移动端不同布局)
媒体查询语法: 1.内联写法:and之后必须有空格@media screen and (min-width:960px //判断浏览器大小条件){body{background:red} //常规的样 ...
随机推荐
- Oracle数据库语言——结构化查询语言SQL
一.数据定义语言DDL 1.创建表空间:CREAT TABLESPACE lyy DATAFILE 'C:/app/lyy.dbf' SIZE 10M;(创建一个10M的表空间,存放在C盘app文件夹 ...
- POJ2425 A Chess Game[博弈论 SG函数]
A Chess Game Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 3917 Accepted: 1596 Desc ...
- POJ2115 C Looooops[扩展欧几里得]
C Looooops Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 24355 Accepted: 6788 Descr ...
- 第三章Struts2 Action中动态方法调用、通配符的使用
01.Struts 2基本结构 使用Struts2框架实现用登录的功能,使用struts2标签和ognl表达式简化了试图的开发,并且利用struts2提供的特性对输入的数据进行验证,以及访问Servl ...
- Object.assign方法复制或合并对象
Object.assign() 方法可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象 var obj = { a: 1 }; var copy = Object.assign({ ...
- android多线程断点续传下载文件
一.目标 1.多线程抢占服务器资源下载. 2.断点续传. 二.实现思路. 假设分为三个线程: 1.各个线程分别向服务器请求文件的不同部分. 这个涉及Http协议,可以在Header中使用Range参数 ...
- github-windows本地安装
Step1 准备工作 msysgit,下载地址为 http://msysgit.github.io/ . Eclipse IDE for Java EE Developers(必须是这个,自带Egit ...
- 【USACO 3.1】Humble Numbers(给定质因子组成的第n大的数)
题意:给你k(≤100)个质数,求质因子只包含它们的第n大的数. 题解: 方法一:维护一个数组,一开始只有给出的质数在里面,用每个质数去乘以数组中每个数,然后归并排序,长度保留到n,一轮接一轮,直到乘 ...
- OpenCV图像细化的一个例子
转自:http://blog.csdn.net/zfdxx369/article/details/9091953?utm_source=tuicool 本文是zhang的一篇经典图像细化论文,效果很好 ...
- 配置windows 系统PHP系统环境变量
1. 首先到php官网下载php-5.3.6-nts-Win32-VC9-x86.ZIP 解压到电脑硬盘.将文件解压到文件夹php5.3.6下载地址:http://www.php.net/downlo ...