//判断横竖屏

@media screen and (min-aspect-ratio: 13/13) { body {background-color:red;}}  //屏幕宽高比,必须是除数形式  [1, +∞)表示横屏

@media screen and (max-aspect-ratio: 13/13) { body {background-color:blue;}}  //屏幕宽高比,必须是除数形式  (-∞, 1] 表示竖屏

2015-04-14——css3 @media的更多相关文章

  1. CSS3 Media Queries 片段

    CSS3 Media Queries片段 在这里主要分成三类:移动端.PC端以及一些常见的响应式框架的Media Queries片段. 移动端Media Queries片段 iPhone5 @medi ...

  2. CVE-2015-1328 Ubuntu 12.04, 14.04, 14.10, 15.04 overlayfs Local Root

    catalog . 引言 . Description . Effected Scope . Exploit Analysis . Principle Of Vulnerability . Patch ...

  3. Css3 Media Queries移动页面的样式和图片的适配问题(转)

    CSS3 Media Queries 摘自:http://www.w3cplus.com/content/css3-media-queries Media Queries直译过来就是“媒体查询”,在我 ...

  4. css3 media媒体查询器用法总结 兼容ie8以下的方法

    总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. http://www.360doc.com/content/14/0704/06/10734150_391862769.shtml ...

  5. Contest2073 - 湖南多校对抗赛(2015.04.06)

    Contest2073 - 湖南多校对抗赛(2015.04.06) Problem A: (More) Multiplication Time Limit: 1 Sec  Memory Limit:  ...

  6. 2015.7.14(大盘结束红色,中色连坐4T)

    中色今天的盘面相当有意思,现场直播庄家和散户斗法我估计中色要拉涨停了,不过你别跟,现在很危险了——就算是涨停,明天一个低开就把你给绕进去了 1.今天开市9:42发现中色的地位买入点良机16.13,此时 ...

  7. CSS3 media媒体查询器的使用方法

    最近几年随着响应式布局的发展,一次开发多次使用,自适应屏幕的响应式网站的需求越来越多.但是怎样使得网站能自适应屏幕呢?这里就需要提到一个css3里面新增的技术了-media媒体查询器. 那么什么是me ...

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

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

  9. CSS3 media 入门

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

  10. 使用CSS3 Media Queries实现网页自适应

    原文来源:http://webdesignerwall.com 翻译:http://xinyo.org 当今银屏分辨率从 320px (iPhone)到 2560px (大屏显示器)或者更大.人们也不 ...

随机推荐

  1. js获取网页宽高

    <script> function getInfo() { var s = ""; s += " 网页可见区域宽:"+ document.body. ...

  2. Go快速入门

    整理一些Go最基本的语法,旨在快速入门. 最简单的hello world package main import "fmt" func main() { fmt.Println(& ...

  3. iOS直播-基于RTMP的视频推送

    iOS直播-基于RTMP的视频推送 所谓的视频推送就是把摄像头和麦克风捕获到视频和音频推送到直播服务器上.我们这里使用推送协议是RTMP协议. 扩展:腾讯直播平台,阿里直播平台,百度直播平台提供均为R ...

  4. [转]解决Access restriction: The type * is not accessible due to restrict

    我在eclipse使用org.omg下的东西的时候报此错误 我用的第一种方法解决了问题 转自:http://blog.sina.com.cn/s/blog_6714fba70100x6mz.html ...

  5. django 模板报错

    "Requested setting TEMPLATE_DEBUG, but settings are not configured. You must either define the ...

  6. MapReduce实战(二)自定义类型排序

    需求: 基于上一道题,我想将结果按照总流量的大小由大到小输出. 思考: 默认mapreduce是对key字符串按照字母进行排序的,而我们想任意排序,只需要把key设成一个类,再对该类写一个compar ...

  7. thinkphp nginx 上配置 并解决get获取到数据现象

    server { listen 80; server_name XXXX.funova.net XXX.funova.com; root /opt/newgm; index index.php; lo ...

  8. EasyUI DataGrid可编辑单元格

    效果如图: 首先在需要可编辑的列上添加一个editor属性,列定义为numberbox编辑类型 <th field="SCORES" editor="{type:' ...

  9. HBase MemStore与HStoreFile 的大小分析

    Sumary: MemStore结构 KeyValue构成细节 HFile分析 Maven 项目例子使用了Maven来管理Dependency,要运行例子,需要有maven环境,后面提到的HFile, ...

  10. json DateTime转换

    前台: function ChangeDateFormat(jsondate) { jsondate = jsondate.replace("/Date(", "&quo ...