【CSS3】Advanced11:Media Queries
1.Browser-size specific CSS
@media screen and (max/min-width:1000px){}
2.Orientation-specific CSS?
@media screen and(orientation landscape/portrait){}
3.Divice-specific CSS
@media handheld ——not be used widely
@media screen and (min-device-height: 768px) and (max-device-width: 1024px) {}
@media (device-pixel-ratio: 2) {}//iphone4 2 physical pixels to every CSS pixel
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
@media screen and (resolution: 326dpi(分辨率)) { /* */ }
@media screen and (min-resolution: 96dpi) { /* */ }
@media screen and (device-aspect-ratio: 16/9) { /* */ }
【CSS3】Advanced11:Media Queries的更多相关文章
- CSS3学习教程:Media Queries详解
说起CSS3的新特性,就不得不提到 Media Queries . Media Queries 的引入,其作用就是允许添加表达式用以确定媒体的情况,以此来应用不同的样式表.换句话说,其允许我们在不改变 ...
- 【CSS3】Advanced5:At Rules:@import, @media, and @font-face
1.@import bolt another stylesheet onto your existing one. @import url(**.css); must be placed at the ...
- 【CSS3】Advanced3:Universal, Child, and Adjacent Selectors
1.Universal selectors eg:#target*{ } 2.Child selectors < something immediately nested within some ...
- 【CSS3】Advanced10:Gradient
1.background:linear-gradient(20deg/(to) bottom right,orange,red,hsl(60,100%,50%)); 2.-webkit-chrome/ ...
- 【CSS3】Advanced9:Transformation
1.transform:rotate(-10deg) skew(20deg,10deg) scaling(2/1,2) translate/移动(100px,200px) 2.transform:ma ...
- 【CSS3】Advanced8:CSS Backgrounds: Multiples, Size, and Origin
1.Multiples,Size,and Origin eg:background-image:url(bg.png),url(bullet.png) 0 50% no-repeat,url(arro ...
- 【CSS3】Advanced7:CSS Transitions
1.animate parts of your design without the need for the likes of JavaScrip 2.allowing smooth animati ...
- 【CSS3】Advanced6:Attribute Selectors
1.with the attribute abbr[title]{color:red} 2.with the attribute and it's value input[type=text][dis ...
- 【CSS3】Advanced4:Advanced Colors
1.rgba(red,green,blue,alpha(不透明度0.0(完全透明)与 1.0(完全不透明)) 2.HSLa(hue(色调 0red 120green 240blue),saturati ...
随机推荐
- 微信video标签全屏无法退出bug
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...
- 关于静态库和动态库的理解(C++)
库的存在,是软件模块化的基础. 库存在的意义: } 库是别人写好的现有的,成熟的,可以复用的代码,你可以使用但要记得遵守许可协议. } 现实中每个程序都要依赖很多基础的底层库,不可能每个人的 ...
- php 删除文件夹及文件
<?php function deleteDir($dir) { if (!$handle = @opendir($dir)) { return false; } while (false != ...
- 网络设备作用和工作ISO层
物理层——中继器和集线器 二者都起数字信号放大和中转的作用. 中继器 Repeater 用来延长网络距离的互连设备.REPEATER可以增强线路上衰减的信号,它两端即可以连接相同的传输媒体,也可以连接 ...
- 告诉你KVC的一切-b
KVC(Key-value coding)键值编码,单看这个名字可能不太好理解.其实翻译一下就很简单了,就是指iOS的开发中,可以允许开发者通过Key名直接访问对象的属性,或者给对象的属性赋值.而不需 ...
- leetcode-110:判断平衡二叉树 Java
Balanced Binary Tree Given a binary tree, determine if it is height-balanced. For this problem, a he ...
- 网页上PNG透明图片的ie6bug
只有IE6有这个Bug,所以的写法这样就可以了 #png{background:url(../images/png32.png) no-repeat;_filter:progid:DXImageTra ...
- codeforces 388C Fox and Card Game
刚刚看到这个题感觉是博弈题: 不过有感觉不像,应该是个贪心: 于是就想贪心策略: 举了一个例子: 3 3 1 2 3 4 3 4 1 2 5 4 1 2 5 8 如果他们两个每次都拿对自己最有利的那个 ...
- php获得当前日期时间 date函数
time()得到从1970-01-01到现在共走了多少秒 要找出前一天的时间就是 time()-60*60*24; 要找出前一年的时间就是 time()*60*60*24*365 那么如何把这个数字换 ...
- Percona Xtrabackup备份mysql全库及指定数据库(完整备份与增量备份)
原文地址:http://www.tuicool.com/articles/RZRnq2 Xtrabackup简介 Percona XtraBackup是开源免费的MySQL数据库热备份软件,它能对In ...