accepted

Another useful media feature is device-aspect-ratio.

Note that the iPhone 5 does not have a 16:9 aspect ratio. It is in fact 40:71.

iPhone < 5:
@media screen and (device-aspect-ratio: 2/3) {}

iPhone 5:
@media screen and (device-aspect-ratio: 40/71) {}

iPhone 6:
@media screen and (device-aspect-ratio: 667/375) {}

iPhone 6 Plus:
@media screen and (device-aspect-ratio: 16/9) {}

iPad:
@media screen and (device-aspect-ratio: 3/4) {}

media query的更多相关文章

  1. 一种让 IE6/7/8 支持 media query 响应式设计的方法

    在不同的浏览器宽度下使用不同的 CSS 声明,常见的方案是使用 media query,但这个方案不支持 IE9 以下浏览器. 国外比较流行的 UI 框架 bootstrap v3 版本中使用 med ...

  2. iPhone CSS media query（媒体查询）

    iPhone5  iPhone6  iPhone6Plus iPad设备 media query(媒体查询)代码. iPhone < 5: @media screen and (device-a ...

  3. [转]CSS3 Media Query实现响应布局

    讲到响应式布局, 相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效果, 设计师提出了响应式布局的设计方案.今 ...

  4. viewport和media query

    viewport: 你可以定义viewport的宽度.如果你不使用width=device-width,在移动端上你的页面延伸会超过视窗布局的宽度(width=980px),如果你使用了width=d ...

  5. media query学习笔记

    原文转自:http://blog.csdn.net/renfufei/article/details/19981133 http://www.cnblogs.com/softlover/archive ...

  6. media query ie8- 兼容实现总结

    虽然说响应式设计的理想状态是,需对pc/移动各种终端进行响应:但是现实是高分辨率的pc端与手机终端屏幕相差太大,像电商这样有大量图片和文字信息的同时排版要求精准的页面,设计一个同时适应高分辨率pc又适 ...

  7. media type与media query

    media type(媒体类型)是css 2中的一个非常有用的属性,通过media type我们可以对不同的设备指定特定的样式,从而实现更丰富的界面.media query(媒体查询)是对media ...

  8. media type和media query

    media type media type是CSS2的重要属性,通过它,可以针对不同的设备指定不同的样式.   media type种类:   用法: <link href="styl ...

  9. 在javascript中使用媒体查询media query

    由于需要,我们可能会在js中用到一些media query,从而针对不同的分辨率做一些操作. //全兼容的 事件绑定 and 阻止默认事件 var EventUtil = { //Notice: ty ...

  10. css3之 media query 使用(转)

    原文链接:http://www.moke8.com/article-5657-1.html 讲到响应式布局, 相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决 ...

随机推荐

  1. 秒懂sql intersect

    首先我们介绍一下intersect这个单词,我们把inter 和sect分开查询,进行理解.   inter :中间的 (internet,net是网,internet 表示网络内部之间的交流).而s ...

  2. Android假退出不是流氓行为

    转自Android假退出不是流氓行为 关于Android程序的退出,目前我们没有再用System.exit(0)或killProcess的机制而是直接用Activity.finish假退出了.因此在内 ...

  3. R语言 多元线性回归分析

    #线性模型中有关函数#基本函数 a<-lm(模型公式,数据源) #anova(a)计算方差分析表#coef(a)提取模型系数#devinace(a)计算残差平方和#formula(a)提取模型公 ...

  4. bzoj3790

    观察发现,这道题目其实就相当于一个最小区间覆盖问题这里的区间是指以每个点为中心的最长回文串很久没写manacher,有点感动不得不说manacher是一个非常好的算法 ..] of char; c,l ...

  5. HDOJ(HDU) 2523 SORT AGAIN(推导排序、、)

    Problem Description 给你N个整数,x1,x2-xn,任取两个整数组合得到|xi-xj|,(0 < i,j<=N,i!=j). 现在请你计算第K大的组合数是哪个(一个组合 ...

  6. （经常看看）jdk 设计模式

    在JDK(Java Development Kit)类库中,开发人员使用了大量设计模式,正因为如此,我们可以在不修改JDK源码的前提下开发出自己的应用软件,本文列出了部分JDK中的模式应用实例,有兴趣 ...

  7. [LeetCode] Word Break 解题思路

    Given a string s and a dictionary of words dict, determine if s can be segmented into a space-separa ...

  8. Django的请求流程(url)

    一.Django是怎么处理请求的? 当你通过在浏览器里敲http://127.0.0.1:8000/hello/来访问Hello world消息得时候,Django在后台有些什么动作呢? 所有均开始于 ...

  9. zoj 1671 Walking Ant【简单bfs】

    Walking Ant Time Limit: 2 Seconds      Memory Limit: 65536 KB Ants are quite diligent. They sometime ...

  10. hdoj 2717 Catch That Cow【bfs】

    Catch That Cow Time Limit: 5000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...