媒体查询-针对不同媒体类型可以定制不同的样式规则
- viewport(视窗) 的宽度与高度
- 设备的宽度与高度
- 朝向 (智能手机横屏,竖屏)
- 分辨率
多媒体查询语法
<link rel="styleSheet" media="all and (min-width:980px)" href="">
@media mediatype and (min-width:750px) and (max-width:1200px){ body{} }
mediatype | description |
---|---|
all | 用于所有多媒体类型设备 |
用于打印机 | |
screen | 用于电脑屏幕,平板,智能手机等。 |
speech | 用于屏幕阅读器 |