CSS3的Media Queries能够检测到的特性总结:

视口(viewport)解释地址:http://baike.baidu.com/view/1522985.htm

width:视口宽度的检测

height:视口高度的检测

device-width:设备屏幕宽度(设备渲染平面宽度)的检测

device-height:设备屏幕高度(设备渲染平面高度)的检测

orientation:设备的横屏与竖屏的检测

aspect-ratio:视口宽度和高度的宽高比的检测

device-aspect-ratio:设备屏幕宽度和高度的宽高比(设备渲染平面宽度和高度的宽高比)的检测

color:每种颜色的位数的检测

color-index:设备的颜色索引表中的颜色数的检测

monochrome:单色帧缓冲区中每像素所使用的位数的检测

resolution:屏幕或打印机的分辨率的检测

scan:电视机的扫描方式的检测

grid:网络设备或位图设备的检测

注意:以上所有特性中,除scan和grid之外,都可以使用min和max前缀来创建一个查询范围。

个别举例:

scan:progressive 逐行扫描,例如:720p HD电视,p表明逐行扫描

scan:interlace 隔行扫描,例如:1080i HD电视,i表明隔行扫描

CSS3媒体查询能检测到的特性小结的更多相关文章

  1. CSS3媒体查询使用小结

    首先我们在使用Media的时候需要先设置下面这段代码,来兼容移动设备的展示效果: 准备工作1:设置Meta标签 <meta name="viewport" content=& ...

  2. CSS3媒体查询

    随着响应式设计模型的诞生,Web网站又要发生翻天腹地的改革浪潮,可能有些人会觉得在国内IE6用户居高不下的情况下,这些新的技术还不会广泛的蔓延下去,那你就错了,如今淘宝,凡客,携程等等公司都已经在大胆 ...

  3. Html5 @media + css3 媒体查询

    css3 media媒体查询器用法总结   随着响应式设计模型的诞生,Web网站又要发生翻天腹地的改革浪潮,可能有些人会觉得在国内IE6用户居高不下的情况下,这些新的技术还不会广泛的蔓延下去,那你就错 ...

  4. iPhone的CSS3媒体查询

    iPhone的CSS3媒体查询: 各版本的iPhone媒体查询是根据其分辨率和一些CSS3媒体查询的特性来实现媒体查询的...详见下: iPhone6的媒体查询: @media only screen ...

  5. CSS3 媒体查询移动设备尺寸 Media Queries for Standard Devices (包括 苹果手表 apple watch)

    /* ----------- iPhone 4 and 4S ----------- */ /* Portrait and Landscape */ @media only screen and (m ...

  6. iPhone6的CSS3媒体查询

    @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : po ...

  7. CSS3媒体查询总结

    1.什么是媒体查询 媒体查询可以让我们根据设备显示器的特性(如视口宽度.屏幕比例.设备方向:横向或纵向)为其设定CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成.媒体查询中可用于 ...

  8. css3 媒体查询的学习。

    1.什么是媒体查询 媒体查询可以让我们根据设备显示器的特性(如视口宽度.屏幕比例.设备方向:横向或纵向)为其设定CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成.媒体查询中可用于 ...

  9. 关于css3媒体查询和响应式布局

    响应式设计 响应式设计可根据所显示的屏幕大小而改变, 它呈现的每个屏幕看起来并不相同.按照可用的屏幕属性,响应式设计提供了 UI 的最佳效果. 例如,如果网站布局上有一个占据 25% 的屏幕宽度的侧边 ...

随机推荐

  1. ORACLE简单触发器

    因工作需要,尝试写一些建议的触发器,下面为其中一例. //创建一个名为TRG_FIN_OPB_ACCOUNTCARD的触发器 create or replace trigger TRG_FIN_OPB ...

  2. Lattice FPGA 板子 调试笔记

    最近在调试LATTICE  FPGA 做的视频板子,颇不顺利,所以记录下来作为以后的参考: 1.FPGA的IO口不是所有的都是双向的,有些有特殊作用的是单向的. 在查阅 LatticeECP3-17E ...

  3. python+selenium 简单尝试

    前言 selenium是一种自动化测试工具,简单来说浏览器会根据写好的测试脚本自动做一些操作. 关于自动化测试,一开始接触的是splinter,但是安装的时候发现它是基于selenium的,于是打算直 ...

  4. VS2015 自动添加头部注释

    让VS自动生成类的头部注释,只需修改两个文集即可,一下两个路径下个有一个 Class.cs文件 D:\Program Files (x86)\Microsoft Visual Studio 14.0\ ...

  5. 简述抽象和封装,对你学习Java有一些作用

    作为一个Java 初学者,对Java的理解可能有些片面,甚至有些错误的理解,对于观看此处的您,希望您选择性观看!!! 天知道我为什么选择学习编程,我不爱编程,但是我既然学习了,还是会努力学习的,在此分 ...

  6. Codeforces632E Thief in a Shop(NTT + 快速幂)

    题目 Source http://codeforces.com/contest/632/problem/E Description A thief made his way to a shop. As ...

  7. Ubuntu 用vsftpd 配置FTP服务器

    网上的文章好难懂啊..只想要简单粗暴,弄好能用就行啊,复杂的以后研究不行吗...折腾好久,其实弄出来能用不就这么点内容吗... 本文在Ubuntu Server 14.04 amd64系统测试. Ma ...

  8. 【BO】安装BO服务器时,oracle服务端安装ora-12514和12541的问题

    今天在安装BO服务器,oracle数据库时,出现了这样一个问题,描述如下: 首先安装oracle10g Server 32位版.安装ORCL数据库之后,使用10gServer下的NET MANAGER ...

  9. js 爱恨情仇说 this

    this 相信大家在写代码的时候都会遇到,可是怎么样才能用好this,估计这个还是有点困难的,虽然你有时候你会用到,但是他所在的具体的几个场景中所代表的是什么意思了?可能这个你就不是很清楚啊.这个就会 ...

  10. gitlab 创建SSH Keys 报500错

    gitlab 创建SSH Keys 报500错 看了一下日志 root@322323:/home/git/gitlab/log# cat production.log Errno::ENOMEM (C ...