1：dp dt device independent pixels 设备无关像素
2：dir：devicePixelRatio 设备像素缩放比
3：计算公式1px=（dpr）的平方 * dp
4:DPI 打印机每英寸可以喷得墨汁点（印刷行业）
5：PPI ：屏幕每英寸的像素数量 即单位内的像素密度
6：ppi=（1136的平方+640的平方）/4=331ppi （视网膜Reina屏）
7：display ：webkit-flex：使用的弹性布局
：flex ：num 占容器的比例
8：不管宽高的水平垂直剧中 ：
：position： absolute ：top：50% ：left：50% : z-index:3 ：-webkit-transform：translate（-50%，-50%） ：border-radius：6px ：background：#fff
9：flexbox 版 不定宽高的水平垂直居中
：justify-content：center ：align-items：center ：display: -webkit-flex
10：弹性图片
：max-width：100%
11：响应式设计 ：重新布局 显示与隐藏
：当页面到达手机屏幕宽度时，很多时候要放弃一些传统的页面设计思想 ：力求页面简单。简介 ：1 同比例缩小元素尺寸 ：2 调整页面结构布局 ：3 隐藏冗余的元素 ： 经常需要切换位置元素使用（绝对定位）减少重绘提高渲染能力
12：一像素边框
：同样是在retina屏幕下的问题 根本原因 1px 使用2dp渲染 ：border：.5px 错误 ：仅仅ios8 可以用 : sacley（.5）
13:单行文本溢出
：overflow：hidden ：white-spance：nowrap ：text-overflow：ellipsis
14：多行文本溢出
：display：-webkit-box：！important
：overflow：hidden
: text-oveflow:ellisis
: word-break:break-all
:-webkit-box-orient:vertical:
:-webkit-line-clamp 2;
15: 300 毫秒的故事
：移动web页面上的click事件都要慢上300ms
:
16：tap 基础事件
: 300ms 延迟怎么破 使用Tap时间代替 click 事件 ：自定义Tap事件 ：在touchstart touchend 时记录时间 手指位置 在touched 时比较 ：如果手指位置为同一位置（或允许移动一个非常小的位移值）且 ：时间较短 （一般认为是200ms） 且过程中未曾出发过touchmove ：即可认为手持设备上的“click” 一般称他为“tap”
17: touch 基础事件
：touchstart：手指触摸屏幕时触发（已经有手指在屏幕上不会出发） ：touchmove：手指在移动屏幕滑动。连续出发 ：touchend ： 手指离开屏幕时触发 ：touchcancel：系统取消touch时候出发（不常用）
