一、移动 web 开发与适配
1、跑在手机端的 web 页面（H5 页面）
2、跨平台（PC 端、手机端 - 安卓、IOS）
3、基于 webview（终端开发技术的一个组件）
4、告别 IE 拥抱 webkit（移动端的手机 webview 基本上都是 wenkit 内核）
5、更高的适配和性能要求（手机屏幕尺寸复杂、网络状况复杂）
二、常见移动 web 适配方法
PC：
960px/1000px 居中
盒子模型、定高、定宽
Display：inline-block
移动 web：
定高、宽度百分比（百分比布局只能做一些很简单的屏幕适配，能适配的移动端布局方案很少）
flex
Media Query（媒体查询）
其中 flex 与 Media Query（媒体查询） 就可以实现响应式布局
Media Query（媒体查询）
使用方法1：
<style type="text/css">
/* 屏幕最大 width 为 320px 时 即屏幕小于等于 320px 时 */
@media screen and (max-width: 320px) { /* css */ }
/* 屏幕最小 width 为 321px 时 即屏幕大于于等于 321px 时 */
@media screen and (min-width: 321px) { /* css */ }
</style>
媒体类型：screen，print... 媒体特性：max-width，max-height...
使用方法2：
<link rel="stylesheet" type="text/css" href="" media="screen and (max-width: 320px)">
响应式布局
即一套前端代码可以针对不同机型；比如 IPhone 和 iPad