media媒体查询

一、引入方式

<link rel="stylesheet" type="text/css" href="index.css" media="all and (min-width:600px)"/>

@import url("css/reset.css") all and (min-width:600px);

@media  all and (min-width:600px){
 // you css
}
@media  all and (orientation:landscape){
 // 横屏样式
}

二、媒体类型

• all 所有媒体
• braille 盲文触觉设备
• embossed 盲文打印机
• print 手持设备
• projecttion 打印预览
• screen 彩屏设备
• speech ‘听觉’类似的媒体类型
• tty 不适用像素的设备
• tv 电视

三、媒体特性

• (max-width:599px)
• (min-width:600px)
• (orientation:portrait) 竖屏
• (orientation:landscape) 横屏
  -(-webkit-min-device-pixel-ratio:2) 像素比

四、关键字

• and
• not
• only