我用过的两种响应式设计:rem&弹性盒模型

为什么要使用响应式设计?

页面的设计和开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成,包括弹性网格和布局、图片、css media query的使用等。无论用户正在使用笔记本还是iPad,我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等,以适应不同设备;换句话说,页面应该有能力去自动响应用户的设备环境。
响应式网页设计就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这样,我们就可以不必为不断到来的新设备做专门的版本设计和开发了。

响应式设计断点应当如何设置?

壹、根据内容来设置断点

普遍的响应式设计一般会要求按照主流设备的屏幕分辨率设置断点。
随着现在手机更新迭代越来越快,屏幕分辨率更是参差多态。
现在设置的断点,可能一年半载就已不适应。
所以与其让「屏幕分辨率」确定断点,不如让「内容」确定断点。

贰、根据屏幕分辨率来设置断点

如果你想使用屏幕分辨率来设置断点,那么就会用到下面这几种常用的分辨率
1.320
2.480
3.760
4.960
5.1200
6.1600

我所用过的两种响应式设计

1、弹性盒模型

2、rem

你可能感兴趣的:(我用过的两种响应式设计:rem&弹性盒模型)