关于获取设备的大小问题:

/* 本条为CSS2部分,IE8及以下只支持本条 */
@media screen{
  body{color:#f00;}
}
/* 下列为CSS3部分 */
@media screen and (min-width:960px){
body{background:#999;}
}
@media screen and (device-width:1024px){
.test{display:block;}
}
@media screen and (width:1024px){
.test2{display:block;}
}

//书写格式
@media:<media_query_list>

<media_query_list>:[<media_query>[',' <media_query>]*]?

<media_query>:[only | not]? <media_type> [and <expression>]* | <expression> [and <expression>]*

<expression>:'('<media_feature>[:<value>]?')'

media的更多相关文章

  1. Intel Media SDK H264 encoder GOP setting

    1 I帧,P帧,B帧,IDR帧,NAL单元 I frame:帧内编码帧,又称intra picture,I 帧通常是每个 GOP(MPEG 所使用的一种视频压缩技术)的第一个帧,经过适度地压缩,做为随 ...

  2. PhoneGap/cordvoa如何添加Media插件

    phonegap由2.7升级到3.7之前,只要引入一个cordova.js,就可以了.现在由于所用的插件,都需要用模块的形式进行按需加载,自然就没有以前那么安逸了. 例如,如果要在安卓平台添加一个音频 ...

  3. 实践 HTML5 的 CSS3 Media Queries

    先来介绍下 media,确切的说应该是 CSS media queries(CSS 媒体查询),媒体查询包含了一个媒体类型和至少一个使用如宽度.高度和颜色等媒体属性来限制样式表范围的表达式.CSS3 ...

  4. Media Queries

    @media screen and (max-device-width: 1920px) and (min-device-width: 1920px) 指定1920分辨率的样式,使用device-wi ...

  5. CSS3 Media Queries 实现响应式设计

    在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...

  6. CSS3 media 入门

    css3 media  严格来说是自适应布局 对不同的屏幕(正确的说应该是) 写不同的css样式.而流式布局 则才算是响应式布局. css3 media  语法: @media mediatype a ...

  7. 关于媒体查询 @Media Screen 与响应式

    其实CSS2中已经有了媒体查询的概念,但是CSS3中媒体查询功能更加的强大! 首先,我们来看一个小例子 设置媒体查询的 Max Width ,改变窗口大小到600px的时候就会触发一下代码: @med ...

  8. 利用@media screen实现网页布局的自适应

    利用@media screen实现网页布局的自适应 优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小.只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽 ...

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

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

  10. CSS3 Media Queries实现响应式布局

    概念我就不在这里写啦.大家可以看看以下网页: http://www.runoob.com/cssref/css3-pr-mediaquery.html http://www.w3cplus.com/c ...

随机推荐

  1. GSON使用笔记(1) -- 序列化时排除字段的几种方式

    http://blog.csdn.net/zxhoo/article/details/21471005 GSON是Google发布的JSON序列化/反序列化工具,非常容易使用.本文简要讨论在使用GSO ...

  2. centos6.5下安装mysql

    http://www.centoscn.com/mysql/2014/0812/3481.html 1.使用yum命令安装mysql [root@bogon ~]#  yum -y install m ...

  3. 提交 git 项目 到 github 在 centos 7

    Git 是分布式版本控制系统(Distributed Version Control System,简称 DVCS),它可以备份文件的历史信息,多个终端可以同时对文件作修改. 文件内容如果有了变化和之 ...

  4. mybatis的逆向工程

    mybatis的逆向工程是很大的减少了程序员对代码的编写工作,由于mybatis是半自动的sql语句使用,我们在项目中一般都是采用逆向工程来生成mybatis的文件,mapper接口相当于我们平常所说 ...

  5. 多态 oc c++ 与oc category

    多态是函数调用的动态绑定技术: c++动态绑定依赖于this指针与虚函数表. 虚函数表的排序规则: 1)虚函数按照其声明顺序放于表中. 2)父类的虚函数在子类的虚函数前面. 3)如果子类重写了父类的虚 ...

  6. Tortoise SVN 安装界面

    Tortoise SVN 安装界面 TortoiseSVN是Subversion版本控制系统的一个免费开源客户端,不需要为使用它而付费 第一步: 点击TortoiseSVN-1.6.6.17493-w ...

  7. Ad-Hoc命令不熟悉的选项

    -f #并发线程数,默认5个线程 --private-key #指定秘钥文件 -k #--ask-pass SSH:认证密码 -K, #--ask-sudo-pass sudo:用户的密码(--sud ...

  8. ES6标准

    1. ES6标准感觉越来越向传统语言靠拢了,以后写到ES6的标准都记录下: ,,]; // =>操作符 array.forEach(v => console.log(v)); 是不是简化了 ...

  9. 安装glue,用glue批量处理图片的步骤

     glue批量处理图片:http://glue.readthedocs.io/en/latest/quickstart.html#and-why-those-css-class-names 首先需要安 ...

  10. Struts 中 ActionContext ctx.put()把数据放到ValueStack里之数据传输背后机制:ValueStack(值栈)

    1.     数据传输背后机制:ValueStack(值栈) 在这一切的背后,是因为有了ValueStack(值栈)! ValueStack基础:OGNL要了解ValueStack,必须先理解OGNL ...