media type

media type是CSS2的重要属性,通过它,可以针对不同的设备指定不同的样式。
 
media type种类:
 
用法:
  1. <link href="style.css" media="screen print" ...
  2. @media screen{ selector{rules} }
例子:
<style type="text/css">
@media screen{
body{
background: green;
}
}
@media handheld{
body{
background: red;
}
}
</style>


效果就是,screen设备的时候,背景是绿色,handheld设备的时候,背景是红色。

media query

media query是对type的增强,更适合移动互联网。一般由media type+一到多个CSS属性判断组成。属性和值之间是用冒号连接的,而不是等号,这与正常的CSS的写法一致。
 
支持与,或(逗号);
not,排除指定的类型;only,用于隐藏老的用户代理的样式表;
min-和max-前缀来表达大于等于或小于等于。
 
支持的属性(与CSS属性不一样):
 
注意IE9以下不支持!当然是有办法解决的,用respond.js
 
例子:
@media screen and (min-width: 700px){
body{
background: green;
}
}
@media screen and (max-width: 600px){
body{
background: red;
}
}
 
效果就是screen设备并且宽度大于700px的时候显示绿色,screen设备并且宽度小于600px的之后显示红色。
没有指定的中间状态是默认的白色。
 
参考:

media type和media query的更多相关文章

  1. media type与media query

    media type(媒体类型)是css 2中的一个非常有用的属性,通过media type我们可以对不同的设备指定特定的样式,从而实现更丰富的界面.media query(媒体查询)是对media ...

  2. media type 与 media query

    参考博客:http://www.qianduan.net/media-type-and-media-query.html media type(媒体类型)是css 2中的一个非常有用的属性,通过med ...

  3. media query(媒体查询)和media type(媒体类型)

    media type(媒体类型)是css 2中的一个非常有用的属性,通过media type我们可以对不同的设备指定特定的样式,从而实现更丰富的界面.media query(媒体查询)是对media ...

  4. angularjs - 415 (Unsupported Media Type)

    angularJs+springMVC angular表单提交一个user实体时,报 angularjs - 415 (Unsupported Media Type)错误!! 原因是$http({ u ...

  5. WSDL2ObjC Unsupported Media Type

    调用WCF服务时,出这样的异常“415 Unsupported Media Type”, Because the WCF soap is v1.1, the http header should be ...

  6. jersey处理支付宝异步回调通知的问题:java.lang.IllegalArgumentException: Error parsing media type 'application/x-www-form-urlencoded; text/html; charset=UTF-8'

    tcpflow以流为单位分析请求内容,非常适合服务器端接口类服务查问题 这次遇到的问题跟支付宝支付后的回调post结果有关 淘宝的代码例子: public void doPost(HttpServle ...

  7. System.Net.WebException : The remote server returned an error: (415) UNSUPPORTED MEDIA TYPE

    I am having problems with a bit of code that accesses a restful web service. Running this code, it e ...

  8. SpringMVC 中HttpMessageConverter简介和Http请求415 Unsupported Media Type的问题

    一.概述: 本文介绍且记录如何解决在SpringMVC 中遇到415 Unsupported Media Type 的问题,并且顺便介绍Spring MVC的HTTP请求信息转换器HttpMessag ...

  9. HTTP请求415错误 – 不支持的媒体类型(Unsupported media type)

    HTTP请求415错误 – 不支持的媒体类型(Unsupported media type) 通常有以下情况: 1:检查你的 http 请求头信息,比如 因为 User-Agent 被服务器设置 拒绝 ...

随机推荐

  1. DIY 博客全文界面的推荐、反对、加关注、返回顶部、快速评论等小功能的集成

    博客园已经很不错了,但作为比较“挑剔”的用户,在使用的过程中,还是有一些地方不爽的. 我不是一个专业的前台程序员,也只能凭借自己蹩脚的JS和CSS知识完成对页面的小改造(专业的大虾莫要鄙视呀..). ...

  2. 解决adb问题的方法

    The connection to adb is down,and a server error has occured. 在网上找的那个高端方法根本不管用,来,试试我的方法.. 先装个360手机助手 ...

  3. android事件分发笔记

    1.SimpleOnGestureListener 遇到的问题: 自己定义一个按钮继承自Button,一开始改变按钮颜色的操作放在onTouchEvent的ATION_DOWN里触发. 这时问题来了, ...

  4. [置顶] Effective STL 学习笔记

    看Effective STL 作的一些笔记,希望对各位有帮助. 以下是50条条款及相关解释. 容器 1. 慎重选择容器类型,根据需要选择高效的容器类型. 2. 不要试图编写独立于容器类型的代码. 3. ...

  5. JAVA的设计模式之单例设计模式

    1.确保一个类只有一个实例,自行提供这个实例并向整个系统提供这个实例. 1)理论 Java Singleton模式主要作用是保证在Java应用程序中,一个类Class只有一个实例存在. 使用Singl ...

  6. XMPP——Smack[1]连接、登陆及账户操作

    临毕业前,应需求,花了三天写了个小的聊天工具,貌似简陋得很….若有机会再完善吧,目前毕业季,处理毕业事宜,还要准备即将的入职. 眼瞅着大学四年就这么结束了,哎. 开始吧,四篇博文简单介绍下基本实现,由 ...

  7. CentOS下系统时间同步和时区的修改和设置(用的这个)

    一.修正时区 rm -rf /etc/localtime #删除当前默认时区www.kwx.gd ln -s /usr/share/zoneinfo/Asia/Shanghai /etc/localt ...

  8. Winfrom treeview 如何从多个数据表中获取数据动态生成

    本文转载:http://www.cnblogs.com/VincentLuo/archive/2008/03/29/1128987.html 在 汪洋怡舟的这篇文章中[http://www.cnblo ...

  9. DataGridView单元格显示GIF图片

    本文转载:http://home.cnblogs.com/group/topic/40730.html DataGridView单元格显示GIF图片 gifanimationindatagrid.ra ...

  10. openssl enc 加解密

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...