移动端

一、app

Native App      原生App
    java        安卓
    oc           ios

    (1)优势
        性能高
        可以调用底层功能
    (2)劣势
        不能跨平台
        最少需要两个团队
        开发周期长
        维护难
        开发成本高

(a)Web App      WebApp
    移动端页面，包了一个壳子变成app

    (1)优势
        可以跨平台
        一个人搞定
        开发周期短
        维护简单
        开发成本低
    (2)劣势
        性能相对原生差
        调用不了底层功能
(b)Hybird App       混合App
    webview
    phonegap
    APICloud
    Ionic
    RN
    HBuilder

二、移动端页面

(1)移动端
    phone   pad     watch   tv
(2)移动端和pc有什么区别吗?
    没有什么区别，pc怎么写，移动端就怎么写,只不过尺寸不一样
    PC
        浏览器之间的兼容
    移动端
        各种设备尺寸的兼容
(3)移动端需要设置视口
    viewport
        页面的尺寸
        初始分辨率
        能否缩放
        最大缩放
        最小缩放
    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1">
    emmet:
        meta:vp
(4)移动端布局有很多种方式
    定宽
    百分比
    弹性
    rem
    响应式

三、弹性

    （a）盒子模型
        width/height+padding+border
        （1）old
            大小不够，往外撑
            box-sizing: content-box;
        （2）new
            大小不够，往里挤
            box-sizing: border-box;
    （b）弹性盒子     flex-box
    (1)开启弹性
        给父级加
        display: -webkit-flex;
        display: flex;
    (2)子级默认分配位置
        -webkit-flex: 系数;
        flex: 系数;
    (3)flex-方向
        flex-direction: row|row-reverse|column|column-reverse
    (4)flex-wrap(换行)
        flex-wrap: nowrap|wrap|wrap-reverse
    (5)justify-content(水平排列)
        center|flex-start|flex-end|space-around|space-between
    (6)align-items(垂直排列)
        center|flex-start|flex-end|baseline