在页面头部加入如下的声明:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
viewport = 视口(设备屏幕)
content = 内容
device-width = 设备宽度
initial-scale = 初始-比例
minimum-scale = 最小-比例
maximum-scale = 最大-比例
media = 媒体
query = 查询
样式:@media screen and (max-width: 500px) {body { background-color: black;}}//屏幕宽度不超过500px时,背景设置为黑色。
max-width,min-width
动态加载样式表:<link rel="stylesheet" media="(max-width: 800px)" href="example.css" />//屏幕宽度不超过800px时,引用该样式表。