css媒体查询

css媒体查询

语法：

@media not|only mediatype and|only|not (mediafeature and|or|not mediafeature){...}

mediatype常用值有

• screen 用于电脑屏幕、智能手机等
• print 打印机
• all 所有设备
• speech 屏幕阅读器等

media feature的值常见有

• min-width / min-height --页面可见的最小宽高
• max-device-width/max-device-height --屏幕可见的最小宽高
• max-resolution/min-resolution --设备最大最小分辨率，如96dpi

PS：一般时候使用max-width或者min-width去限定不同设备的宽度。

@media screen and (max-width:600px) {
	.container{
		width:100%;
	}
}