【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 ...
随机推荐
- PS初始化配置
前端工程师在使用photoshop之前需要进行一些初始化设置,主要包括以下3个 [1]首选项设置 <ctrl+k> 编辑 > 首选项 > 单位与标尺 > 把标尺和文字的单 ...
- hggroup和adress
hggroup通常放在标签内部,不过不做强制要求! adress 通常用于作者的联系信息.比如名字,Email,电话,地址.标签内字体显示斜体. 与 标签的比较:比div简洁,更少的用到id或c ...
- Sqlserver循环嵌套
1.游标的状态,游标的开启游标的选择都是需要注意的. USE [ccnu] GO /****** Object: StoredProcedure [dbo].[P_ADD_DATA_XSBLHYCQK ...
- 我的PHP之旅--数组的认识(初级)
数组 PHP的数组与swift有些许不同,分为3类(初级,以后会涉及到多维数组和数组指针等). 枚举数组 关联数组 混合数组 枚举数组 枚举数组跟swift中的数组差不多: <?php $arr ...
- HTML5下通过response header解决跨域AJAX cookie的问题
ajax: 通过给Response Header添加Access-Control-Allow-Origin:* 来解决跨域请求,*代表允许所有的跨域请求,或者把*换成指定的域名 cookie: 服务 ...
- HDU 1560 DNA sequence (IDA* 迭代加深 搜索)
题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=1560 BFS题解:http://www.cnblogs.com/crazyapple/p/321810 ...
- 服务器环境搭建系列(四)-mysql篇
1.按照上一篇服务器环境搭建系列(三)-JDK篇中的方法检查系统是否已经预装Mysql并卸载. 2.下载mysql,这里是MySQL-server-5.5.25-1.linux2.6.x86_64.r ...
- Java编程思想(2)之一切皆对象
- 0xc0000428 winload.exe无法验证其数字签名的解决方法
只要把windows/system32/boot中的winload.exe复制到windows/system32中替换即可!! 只有启动画面会有变化,可以使用魔方等软件进行修复,恢复到之前的样子
- 安卓接入ShareSDK问题
平台图标错乱原因 导出的jar包 包括了 style.class R$attr.class MainActivity.class R$color.class R$drawable.class R$s ...