media语法:

  <link rel="stylesheet" media="screen and (max-width: 600px)" href="small.css" />

  上面的media语句表示的是:当屏幕宽度小于或等于600px,调用small.css样式表来渲染Web页面。

  含义:

    screen:指的是一种媒体类型;还可以选择all、print、TV等。

    and:关键词,与其相似的还有not,only。

    max-width: 600px:媒体特征,指当媒体小于600px时调用该样式

引入方法:

  1、link引入:

    <link rel="stylesheet" type="text/css" href="../css/print.css" media="print" />

  2、@import引入

    @import url("css/reset.css") screen;

  3、@media引入:

    @media screen{ 选择器{ 属性:属性值; } }

css3整理--media的更多相关文章

  1. CSS3 之 Media(媒体查询器)

    1.响应式Media(媒体查询器) (1)<link rel=“stylesheet” media=“screen and (max-width: 600px)” href=“small.css ...

  2. 控制页面打印的2种方法(css3的media媒体查询和window.print())

    在实际开发中,有时可能会有打印的需求.下面我总结了2种打印的方法,希望对各位小伙伴有所帮助. ①:直接用window.print()方法就可以打印整个页面,下面是一个小demo <!DOCTYP ...

  3. 使用CSS3的@media来实现网页自适应

    如今,电脑显示器的屏幕分辨率向越来越大发展,而手机等移动设备终端的分辨率却不可能大到哪里去.越来越多的网站,开始让自己的页面自适合各种分辨率,在小分辨率下显示基本的内容,在大分辨率下显示全部功能,甚至 ...

  4. 使用CSS3的@media来编写响应式的页面

    首先要知道,我们为什么要写自适应的页面(响应式页面) [直接看干货] 众所周知,电脑.平板.手机的屏幕是差距很大的,假如在电脑上写好了一个页面,在电脑上看起来不错,但是如果放到手机上的话,那可能就会乱 ...

  5. css3之 media query 使用(转)

    原文链接:http://www.moke8.com/article-5657-1.html 讲到响应式布局, 相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决 ...

  6. css3整理-方便查询使用

    最近详细地研究了CSS3的相关内容,并整理了这个文档,方便以后查询使用,分享给大家. 案例代码大家可以下载参考下:https://gitee.com/LIULIULIU8/CSS3 1.边框属性bor ...

  7. css3之Media Queries 媒体查询

    一.初步了解 Media Queries是CSS3新增加的一个模块功能,其最大的特点就是通过css3来查询媒体,然后调用对应的样式. 了解Media Queries之前需要了解媒体类型以及媒体特性: ...

  8. css3的@media媒体查询

    css3新功能,根据屏幕大小进行识别. 参考: http://www.runoob.com/cssref/css3-pr-mediaquery.html

  9. [CSS3] CSS Media Queries

    Using CSS media queries allows you to design responsive layout in your web apps and website. We will ...

随机推荐

  1. SIGALRM信号和SIGCHID信号

    在进行堵塞式系统调用时.为避免进程陷入无限期的等待,能够为这些堵塞式系统调用设置定时器.Linux提供了alarm系统调用和SIGALRM信号实现这个功能. 要使用定时器.首先要安装SIGALRM信号 ...

  2. Github和Git上fork指南

    现在有这样一种情形:有一个叫做Joe的程序猿写了一个游戏程序,而你可能要去改进它.并且Joe将他的代码放在了GitHub仓库上.下面是你要做的事情: fork并且更新GitHub仓库的图表演示 For ...

  3. Android开发中遇到的问题(二)——新建android工程的时候eclipse没有生成MainActivity和layout布局

    一.新建android工程的时候eclipse没有生成MainActivity和layout布局 最近由于工作上的原因,开始学习Android开发,在入门的时候就遇到了不少的坑,遇到的第一个坑就是&q ...

  4. svn与git操作对比 (未来有空做一个 svn与git实战对比 )

    svn是集中式的,git是分布式的,但是我们日常使用的都是按照集中式唯一服务器仓库的方式来去做的,最终我们的代码都要提交到一个唯一仓库中. 他们最大的区别是本地工作拷贝的工作方式不同, 一.svn本地 ...

  5. Java 之外,是 Scala 还是 Groovy?【转载】

    原文地址 Scala 和 Groovy 都是基于 JVM 的语言,相比 Java,它们都有语法更加简明和表达能力更丰富.对于那些既想不脱离开 JVM 又想避免 Java 繁琐语句的开发人员来说,Sca ...

  6. WPF Dispatcher介绍

    微软在WPF引入了Dispatcher,那么这个Dispatcher的主要作用是什么呢?Dispatcher的作用是用于管理线程工作项队列.主线程负责接收输入.处理事件.绘制屏幕等工作,这样一来,UI ...

  7. grid - 网格轨道最小和最大尺寸

    可以通过minmax()函数来创建网格轨道的最小或最大尺寸. minmax()函数接受两个参数: 第一个参数定义网格轨道的最小值 第二个参数定义网格轨道的最大值 可以接受任何长度值,也接受auto值. ...

  8. Duplicate复制数据库并创建物理StandBy(spfile版本)

    过程和Duplicate复制数据库并创建物理StandBy类似,只是不需要重启数据库. 目的:创建standby,不重启源数据库 1设定环境如下: Primary数据库 IP 172.17.22.16 ...

  9. Windows视频桌面壁纸实现(libvlc)(类似于wall paper engine效果)

    简介 这个项目是很久之前的事情了,当时一个朋友正在研究一个国外的软件(wall paper engine ),可以在桌面壁纸层播放视频,也就差不多是动态壁纸的意思. 后来我也动手来实现这个功能,因为手 ...

  10. Jmeter笔记:响应断言详解

    转自:http://www.51testing.com/html/80/n-2430180.html 平时我们使用jmeter进行性能测试时,经常会用到断言.jmeter提供了很多种断言,本来想全都写 ...