CSS—媒体查询器@media媒体查询器。针对不同的屏幕尺寸设置不同的样式☆当屏幕尺寸大于320px时，不包含指定值☆当

@media

媒体查询器。针对不同的屏幕尺寸设置不同的样式

@media only screen and (min-width:320px){
	div{ color:red }
}

@media only screen and (max-width:640px){
	div{ color:red }
}

@media only screen and (min-width:320px) and (max-width:640px){
	div{ color:red }
}

@media only screen and (width:320px) and (height:640px) {
	div{ color:red }
}

@media only screen and (device-aspect-ratio:1.0){
	div{ color:red }
}

@media only screen and (min-device-width:320px) and (max-device-width:480px){
	div{ color:red }
}

@media print and (min-resolution: 144dpi){
	div{ color:red }
}

@media screen and (-webkit-min-device-pixel-ratio:1.0){
	div{ color:red }
}

@media (device-width:720px) and (-webkit-min-device-pixel-ratio:2){
    div{ color:red }
}

@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){
	div{ color:red }
}

@media all and (orientation:landscape) {
	div{ color:red }    
}

@media all and (orientation:portrait){
	div{ color:red }
}

①only

用于电脑屏幕，平板电脑，智能手机等

@media only screen and{ }

②not

非屏幕

@media not screen and(){ }

③and

所有设备

@media all and(){ }