自适应的CSS代码片段(常用)
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
} /* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {
/* Styles */
} /* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* Styles */
} /* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* Styles */
} /* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
} /* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
} /* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {
/* Styles */
} /* Large screens ----------- */
@media only screen and (min-width : 1824px) {
/* Styles */
} /* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5) {
/* Styles */
}
自适应的CSS代码片段(常用)的更多相关文章
- HTML/CSS代码片段
内容简介:本文收集了我常用的CSS代码片段! *reset @charset "utf-8"; /* reset */ body, dl, dd, h1, h2, h3, h4, ...
- 30+有用的CSS代码片段
在一篇文章中收集所有的CSS代码片段几乎是不可能的事情,但是我们这里列出了一些相对于其他的更有用的代码片段,不要被这些代码的长度所吓到,因为它们都很容易实现,并且具有良好的文档.除了那些解决常见的恼人 ...
- 转--Android实用的代码片段 常用代码总结
这篇文章主要介绍了Android实用的代码片段 常用代码总结,需要的朋友可以参考下 1:查看是否有存储卡插入 复制代码 代码如下: String status=Environment.getE ...
- 【转】30+有用的CSS代码片段
来自:WEB资源网 链接:http://webres.wang/31-css-code-snippets-to-make-you-a-better-coder/ 原文:http://www.desig ...
- 60个有用CSS代码片段
1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: re ...
- Css学习总结(2)——60个有用CSS代码片段
1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: re ...
- 实用的60个CSS代码片段
1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: re ...
- 拥有的50个CSS代码片段(上)
1. CSS 重置 ;;;font-size: 100%; font: inherit; vertical-align: baseline; outline: none; -webkit-box-si ...
- 一段自适应的CSS代码
一段自适应HTML5的CSS代码,该代码在陕西特产使用过,手机端效果还好,就是PC端看起来没那么大气,比较窄屏 * { transition-property: all; -ms-transition ...
随机推荐
- fedora 取消自动升级
fedora启动时经常CPU使用很高,看下进程原来是yumBackend.这是个yum的自动更新进程 只要关闭自动更新就可以了 gsettings set org.gnome.settings-dae ...
- vijos 1085 Sunnypig闯三角关
{这个题5个正确,五个超时,不要盲目相信我的代码,谁有更好的算法或者优化请留言,(*^__^*) 嘻嘻……} 背景 贪玩的sunnypig请Charles为他打造一个奇幻世界,Charles欣然答应了 ...
- uxpin books
http://uxpin.com/knowledge.html/?utm_source=Email+Marketing+Automation&utm_campaign=80d94e146a-l ...
- ajax 获取 mysql 保存的图片显示
function ajax_GetFirstData(data) { var len = data.Data.length; if (len > 0) { $("#jquery_jpl ...
- 使用Sqlserver事务发布实现数据同步
事务的功能在sqlserver中由来已久,因为最近在做一个数据同步方案,所以有机会再次研究一下它以及快照等,发现还是有很多不错的功能和改进 的.这里以sqlserver2008的事务发布功能为例,对发 ...
- Linux下反斜杠号"\"引发的思考
今天在检查home目录时发现有一个名为“\”的文件,觉得很奇怪,从来没见过,就准备用Vim打开看看,很自然地输入命令查看一下,结果居然打不开. ubuntu@ubuntu:~$ vi \> ub ...
- fzu 2105 Digits Count ( 线段树 ) from 第三届福建省大学生程序设计竞赛
http://acm.fzu.edu.cn/problem.php?pid=2105 Problem Description Given N integers A={A[0],A[1],...,A[N ...
- 1176: [Balkan2007]Mokia - BZOJ
Description维护一个W*W的矩阵,每次操作可以增加某格子的权值,或询问某子矩阵的总权值. 修改操作数M<=160000,询问数Q<=10000,W<=2000000.Inp ...
- HTML5的本地存储 LocalStorage
localStorage顾名思义,就是本地存储的意思,在以前很长一段时间,要想在客户端存 储一些配置及登录信息等数据都只能通过COOKIE或flash的方式,如今html5来临,也 带来了更强大的本地 ...
- [转载]JQuery的Ajax跨域请求的解决方案
今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发现JQuer ...