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

/* 本条为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. 第二次作业———“A+B Format”思路与总结

    GitHub链接: https://github.com/zzy19961112/object-oriented "A+B Format" 题目 解题思路: 一开始粗略看这道题,熟 ...

  2. oracle修改表字段名时报错:ORA-00054:资源正忙,但指定以NOWAIT方式获取资源,或者超时失效的问题

    打开sql plus select session_id from v$locked_object;查询出oracle锁定的会话ID SELECT sid, serial#, username, os ...

  3. RNN 入门教程 Part 3 – 介绍 BPTT 算法和梯度消失问题

    转载 - Recurrent Neural Networks Tutorial, Part 3 – Backpropagation Through Time and Vanishing Gradien ...

  4. 整理CSS引发的相关理论的梳理

    写在前面 因为原先项目中的CSS样式乱得不行,所以领导决定要花大时间整理一下样式,也为了后续维护起来方便.其实也苦了自己,想想也是一件多烦的事情,烦的原因并非是说这件事情做起来没有意义,而是觉得这样的 ...

  5. JS-用js的for循环实现九九乘法表以及其他算数题等

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>f ...

  6. js初学—js全自定义单选框

    代码如下: <script type="text/javascript"> window.onload=function() { var oIput=document. ...

  7. htons

    在Windows和Linux网络编程时需要用到的,用来将主机字节顺序转化为网络字节顺序,以Windows下的代码为例: 1 2 #include<winsock2.h> u_shortht ...

  8. UDP SOCKET网络通信 C#

    接收端 using System; using System.Net; using System.Net.Sockets; using System.Text; using System.Thread ...

  9. Sky Box

    http://www.keithlantz.net/2011/10/rendering-a-skybox-using-a-cube-map-with-opengl-and-glsl/ http://o ...

  10. JS中两个重要的方法 call & apply 学习

    正题: Function.prototype.apply(instance,args)  //args 数组 Function.prototype.Call(instance,a1,a2)  //a1 ...