语法:
@media mediatype and|not|only (media feature) {
CSS-Code;
}
mediatype 应用 media 的设备类型
- all
- screen
应用于手机、电脑、平板 - print
应用于打印机 - speech
应用于屏幕阅读器等发声设备
media feature 查询条件，符合条件即执行
常用的有: width、min-weidth、max-width、height、min-height、max-height、device-width、device-height
orientation:landscape 横屏
orientation:portrait 竖屏
min大于数值成立、max 小于数值成立
and|not|only 衔接多个判断条件，类似 if() 中使用 && ||
not|only 针对设类型(媒体类型) mediatype
示例
@media only screen and (min-width:960px) and (max-width:1200px) {
// 仅在 screen 设备上 满足 宽度大于等于960px且小于等于1200px时触发
}
