一、 pixel 移动开发像素
移动端
640*1136图能否在phone5上置满？
逻辑像素：px，浏览器使用
无关像素（物理像素）：dp,pt；设备无关，是多大就显示多大
设备像素缩放比：dpr,结合两者
维度：1px=2*dp
DPI:打印机每寸喷点
PPI:单位英寸内像素密度
以上两种相同
ppi越高，像素越高，图像越清晰
retina屏幕
ldpi：120 0.75；
mdpi:160 1.0;
hdpi：240 1.5；
xhdpi:320 2.0;
p6-----------3.0;
二、viewport
pc在移动端展示？
viewport我理解为手机、电脑视图的对接
通过两个屏幕
一个是窗口的屏幕 布局排版
一个是手机的屏幕 缩放展示
980px的窗口不规范，用户体验不好
通过设置meta标签
例子：
最佳设置
固定布局
弊端
换移动设备不能跟着变
所以可以用flex弹性盒子布局
-------------------------------------------------------
flex弹性盒子布局
属性
排列方式flex-direction
是否换行flex-wrap
以上两点简写：flex-flow
**************************************
子元素横向排版：flex-content
子元素自己排版：align-self
父元素设子元素：align-items
子元素换行方式：align-content
排序：order
但是！flex有兼容性问题
----------------------------------------------------------
响应式设计
pc端、移动端所有的设备都能够展示
核心逻辑是 媒体查询
相对应的设备宽度 做出不同的调整
特殊处理
图片