移动终端学习1:css3 Media Queries简介
移动终端学习之1:css3 Media Queries简介
1、link方法引入
<link rel="stylesheet" type="text/css" href="../css/print.css" media="screen and (min-width:900px)" />
2、xml方式引入
<?xml-stylesheet rel="stylesheet" media="screen" href="css/style.css" ?>
3、@import方式引入
这种使用方法在ie6-7都不被支持 如:样式文件中调用另一个样式文件:
@import url("css/reset.css") screen;
@import url("css/print.css") print;
在<head></head>中调用:
<head>
<style type="text/css">
@import url("css/style.css") all;
</style>
</head>
4、@media引入
样式文件中使用:
@media screen{
选择器{
属性:属性值;
}
}
在<head></head>中的<style>...</style>中调用:
<head>
<style type="text/css">
@media screen{
选择器{
属性:属性值;
}
}
</style>
</head>
width - viewport的宽度 height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放
移动终端学习1:css3 Media Queries简介的更多相关文章
- 移动终端学习一:css3 Media Queries简介
移动终端学习之一 css3 Media Queries简介 1.简介 别人写过的我就不重复了,来个链接:http://www.w3cplus.com/content/css3-media-querie ...
- CSS3 Media Queries 简介
原文链接:Introduction to CSS3 Media Queries 原文日期: 2014年2月21日 翻译日期: 2014年2月26日 翻译人员: 铁锚 简介 随着移动设备的日益普及,we ...
- CSS3学习教程:Media Queries详解
说起CSS3的新特性,就不得不提到 Media Queries . Media Queries 的引入,其作用就是允许添加表达式用以确定媒体的情况,以此来应用不同的样式表.换句话说,其允许我们在不改变 ...
- CSS3 Media Queries 实现响应式设计
在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
- 【CSS3 入门教程系列】CSS3 Media Queries 实现响应式设计
在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...
- [转]响应式web设计之CSS3 Media Queries
开始研究响应式web设计,CSS3 Media Queries是入门. Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变 ...
- CSS3 Media Queries模板:max-width和min-width
CSS3 Media Queries模板 CSS3 Media Queries一般都是使用“max-width”和“min-width”两个属性来检查各种设备的分辨大小与样式表所设条件是否满足,如果满 ...
- CSS3 Media Queries 片段
CSS3 Media Queries片段 在这里主要分成三类:移动端.PC端以及一些常见的响应式框架的Media Queries片段. 移动端Media Queries片段 iPhone5 @medi ...
- HTML5实践 -- 使用CSS3 Media Queries实现响应式设计
CSS3 Media用法介绍:http://www.w3cplus.com/content/css3-media-queries 转载请注明原创地址:http://www.cnblogs.com/so ...
随机推荐
- 【HDOJ】1756 Cupid's Arrow
图论,点在多边形内部的判定. /* 1756 */ #include <iostream> #include <string> #include <map> #in ...
- 《C#并行编程高级教程》第5章 协调数据结构 笔记
本章介绍了一些轻量级的同步原语,其中有很大部分是.NET Framework 4才引入的. System.Threading.Barrier 用于一段程序分成多个阶段,每个阶段的开始都需要之前的阶段完 ...
- HTML5,CSS3 与 Javascript 制作视频播放器
早一段时间,有一直研究 HTML5 和 CSS3 ,自己也做了不少 Demo ,只是 HTML5 Video 和 Audio 由于自己平时比较喜欢留意不同的播放器,因此特别想做一个自己喜欢的设计,考虑 ...
- udhcpc和udhcpd移植
实现DHCP自动获取IP地址 前提:系统已经实现DNS(即使用ping www.baidu.com测试时能ping通). 1. 在内核中添加以下选项: Networking ---> [*] ...
- aggregate 和 treeAggregate 的对比
1.定义 [aggregate] /** * Aggregate the elements of each partition, and then the results for all the pa ...
- linux find用法总结
前言:我们为什么要学会使用find命令? 转自:http://blog.chinaunix.net/uid-24648486-id-2998767.html 每一种操作系统都有成千上万的文件组成,对于 ...
- 应用引擎BAE3.0介绍及百度BAE3.0支持并发多少
百度云BAE3.0的特点:1.支持本地程序迁移百度云应用引擎BAE3.0做了很多的改进,其实就是一句话,百度云开发在不断的进步.为了节省开发者的学习成本,百度云BAE3.0增加了轻量级虚拟机,使开发环 ...
- algorithm@ dijkstra algorithm & prim algorithm
#include<iostream> #include<cstdio> #include<cstring> #include<limits> #incl ...
- strip, 关于去除目标文件种的不必要信息
对于so动态库及可执行文件,可以直接调用不带参数的strip (-s, 即--strip-all)去除大多数不必要的信息.因为so库非常标准,所以strip之后仍然可以进行完美的动态连接:而可执行文件 ...
- git 秘钥的生成
在命令查看自己的秘钥还是公钥 cat .ssh/id_rsa.pub/cat .ssh/id_rsa