学习笔记之----媒体查询

媒体查询格式

@media+设备/媒体类型+媒体特性

例：

@media screen and (max-width:480px){
 .ads {
   display:none;
  }

当屏幕尺寸小于或者等于480px 时，样式生效

多个媒体特性使用

用and连接多个媒体特性

@media screen and (min-width:600px) and (max-width:900px){
  body {background-color:#f5f5f5;}
}

设备屏幕的输出宽度 device width

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

max device width指的是设备的实际分辨率，即可视面积分辨率。

not关键字用于排除媒体适用的样式