css3 media
@media screen and (max-width: 320px) {
.cloud{position: fixed;left:;top: 70%;width: 150px;}
.cloud2{position: fixed;right:;top: 30%;width: 50px;}
.cloud3{position: fixed;left:;top: 23%;width: 100px;}
}
@media screen and (min-width: 321px) and (max-width: 375px) {
.cloud{position: fixed;left:;top: 72%;width: 150px;}
.cloud2{position: fixed;right:;top: 32%;width: 50px;}
.cloud3{position: fixed;left:;top: 25%;width: 100px;}
}
@media screen and (min-width: 376px) {
.cloud{position: fixed;left:;top: 68%;width: 150px;}
.cloud2{position: fixed;right:;top: 32%;width: 50px;}
.cloud3{position: fixed;left:;top: 25%;width: 100px;}
}
@media screen and (max-height: 480px) {
.cloud{position: fixed;left:;top: 81%;width: 150px;}
.cloud2{position: fixed;right:;top: 35%;width: 50px;}
.cloud3{position: fixed;left:;top: 27%;width: 100px;}
}
css3 media的更多相关文章
- CSS3 Media Queries 实现响应式设计
在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
- CSS3 media 入门
css3 media 严格来说是自适应布局 对不同的屏幕(正确的说应该是) 写不同的css样式.而流式布局 则才算是响应式布局. css3 media 语法: @media mediatype a ...
- 使用CSS3 Media Queries实现网页自适应
原文来源:http://webdesignerwall.com 翻译:http://xinyo.org 当今银屏分辨率从 320px (iPhone)到 2560px (大屏显示器)或者更大.人们也不 ...
- [转]CSS3 Media Query实现响应布局
讲到响应式布局, 相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效果, 设计师提出了响应式布局的设计方案.今 ...
- 【CSS3 入门教程系列】CSS3 Media Queries 实现响应式设计
在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
- CSS3 Media Queries 片段
CSS3 Media Queries片段 在这里主要分成三类:移动端.PC端以及一些常见的响应式框架的Media Queries片段. 移动端Media Queries片段 iPhone5 @medi ...
- css3 media媒体查询器用法总结
随着响应式设计模型的诞生,Web网站又要发生翻天腹地的改革浪潮,可能有些人会觉得在国内IE6用户居高不下的情况下,这些新的技术还不会广泛的蔓延下去,那你就错了,如今淘宝,凡客,携程等等公司都已经在大胆 ...
- HTML5实践 -- 使用CSS3 Media Queries实现响应式设计
CSS3 Media用法介绍:http://www.w3cplus.com/content/css3-media-queries 转载请注明原创地址:http://www.cnblogs.com/so ...
- CSS3 Media Queries模板
使用max-width @media screen and (max-width: 600px) { //你的样式放在这里.... } 使用min-width @media screen and (m ...
- CSS3 Media Queries在iPhone4和iPad上的运用
CSS3 Media Queries的介绍在W3CPlus上的介绍已有好几篇文章了,但自己碰到的问题与解决的文章还是相对的较少.前几天在<修复iPhone上submit按钮bug>上介绍了 ...
随机推荐
- python之路--内置函数03
一 . 正则表达式 匹配字符串 元字符 . 除了换行 \w 数字, 字母, 下划线 \d 数字 \s 空白符 \n \t \b 单词的边界 \W 非xxx \D \S [ ] 字符组 or的关系 [^ ...
- python学习笔记(7)--循环语句
循环语句如下: for i in range(start, end): //注意 前闭后开 coding for i in range(m,n,k): coding for c in s: codin ...
- java float double bigdecimal
java 有 float,double,BigDecimal 三种,前两者会损失精度,最后一个是专门用于高精度计算的大数类型,但是会损失性能.如果用于金融场合且小数位并不多的时候,可以考虑 BigDe ...
- scss 转为 less
tnpm install less-plugin-sass2less -g && sass2less **/*.scss {dir}/{name}.less && rm ...
- Appium之开发环境搭建
1.下载Appium 去官方网站下载http://appium.io/# : 本次以appium-desktop-setup-1.8.0.exe 文件为例,使用桌面版就不再需要下载server版本: ...
- 九、.net core用orm继承DbContext(数据库上下文)方式操作数据库
一.创建一个DataContext普通类继承DbContext 安装程序集:Pomelo.EntityFrameworkCore.MySql 二.配置连接字符串(MySql/SqlServer都 ...
- 4.namespace
命名空间( namespace)是 Linux 内核的一个强大特性,为容器虚拟化的实现带来极大便 利. 利用这一特性,每个容器都可以拥有自己单独的命名空间,运行在其中的应用都像是在 独立的操作系统环境 ...
- 【python练习题】程序8
#题目:输出 9*9 乘法口诀表. for i in range(1,10): k = '' for j in range(1,i+1): k += '%s * %s = %s '%(i,j,i*j) ...
- pip 指定版本
要用 pip 安装特定版本的 Python 包,只需通过 == 操作符 指定,例如: pip install -v pycrypto==2.3 将安装 pycrypto 2.3 版本.
- <c:forEach>可以默认的把以逗号分隔的字符串作为一个集合来遍历
<c:forEach>可以默认的把以逗号分隔的字符串作为一个集合来遍历