移动开发-UI设计

 

 

UI：手机的用户界面

UI物理版：手机实际的屏幕像素

UI设计版：我们截屏的手机界面在ps中去量，发现的尺寸

UI放大版：手机的尺寸等比放大1.5倍得出的分辨率

 

响应式布局

原由：窗体缩小时图片和文字会出现不完整的情况，优化有限

媒体查询（媒介查询）

相应思布局的三要素：（1）流动网格，（2）弹性图片 （3）媒介查询

三个不同的概念：（1）自适应布局 （2）弹性布局 （3）响应式布局

三个不同单位：（1）px  （2）em  相对长度单位  >1.相对参照物为父元素的font-size ， >2.具有继承的特点，当没有设置font-size时，浏览器会有一个默认的em设置：1em = 16px；容易混乱

（3）rem的相对参照物为根元素html，相对于参照物固定不变所以比较好计算

>1.当没有设置font-size时，浏览器会有一个默认的rem

>2.设置：1rem = 16px， 这点与em是一致的

>3.font-size:62.5%  1rem = 10px （10/16*100%）

>4.font-size:100%  1rem = 16px

缺点:有些浏览器不兼容，ie8和以下不兼容

实现兼容ie8浏览器的方法:再写一句代码：font-size:16px;