页面架构——响应式布局

viewport

<meta name="viewport" content="width=device-width，initial-scale=1.0，user-scalable=no" />
把viewport设置成设备宽度，缩放1.0，防止用户手动缩放

@media媒体查询

@media screen and （max-width=xxxpx）{
css代码
}
@media screen and （min-width=xxxpx）{
css代码
}