1.(四).多倍图的概念
- 对于正常大小的图片,在手机中retina屏中打开,会按照物理像素比被放大倍数,例如1px会被放大到2个或以上的物理像素,从而造成图片模糊的情况
- 在标准的viewport设置中,使⽤倍图来提⾼图⽚质量,解决在⾼清设置中的模糊问题 例如:如果需要50*50像素(css像素)的图⽚,直接放在⼿机移动端,图⽚就会被放⼤2甚⾄更多 倍,好⽐放到100*100(css像素),图⽚势必会变得模糊。所以我们可以直接准备⼀个100*100图 ⽚,然后⼿动的把图⽚缩⼩到50*50(css像素),这样到⼿机⾥后,它被放⼤2倍,正好也是100*100 的,从⽽也不会变得模糊
2.(五).移动端 运行在移动设备上的产品
移动设备:手机 平板 ipad
响应式:
在不同的设备上都能给⽤户再好的体验
响应式开发: 随着移动互联⽹的兴起,不同设备的分辨率相差⽐较⼤,如果在不同设备上显示同⼀个⻚⾯,则⽤户 体验差。
响应式⻚⾯设计是⼀种⽅法,使得⼀个⽹站能够兼容多个终端,⽽不⽤为每个终端制作特定的版本。
它使⼀个⽹站在任何类型的屏幕上,都能被轻松浏览使⽤,采⽤响应式设计,在不同设备中,⽹站会 重新排列
展现出不同的设计⻛格,以完美的适配任何尺⼨的屏幕
响应式设计原则 渐近增强 基本需求==>更好体验 优雅降级 完备功能==>向下兼容 移动优先的响应式布局采⽤的是渐进增强原则