页面的设计和开发应当根据用户行为以及设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相应的响应和调整。具体的实践方式由多方面组成，包括弹性网格和布局、图片、css media query的使用等。无论用户正在使用笔记本还是iPad，我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等，以适应不同设备；换句话说，页面应该有能力去自动响应用户的设备环境。
响应式网页设计就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这样，我们就可以不必为不断到来的新设备做专门的版本设计和开发了。
普遍的响应式设计一般会要求按照主流设备的屏幕分辨率设置断点。
随着现在手机更新迭代越来越快，屏幕分辨率更是参差多态。
现在设置的断点，可能一年半载就已不适应。
所以与其让「屏幕分辨率」确定断点，不如让「内容」确定断点。
如果你想使用屏幕分辨率来设置断点，那么就会用到下面这几种常用的分辨率
1.320
2.480
3.760
4.960
5.1200
6.1600
为什么要使用响应式设计？ 页面的设计和开发应当根据用户行为以及设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相应的...
响应式布局：CSS3弹性盒flex布局模型
视口 屏幕适配 布局 流体布局 响应式布局 rem布局 弹性盒模型布局
display:flex(弹性盒模型)，经常用在响应式开发中。行式布局 flex-flow: row;html css：
1、flexbox（弹性盒布局模型） Flexible Box简称flex，意为”弹性布局”，可以简便、完整、响应...
CSS布局 盒模型 Flexbox 使用float布局 inline-block 布局 响应式设计和布局 CSS面...
bootstrap 容器 栅格系统 列偏移 列排序 响应式工具 容器与栅格盒模型设计的精妙之处
Flex 弹性布局能为盒状模型提供最大的灵活性，可以简便完整响应式地实现各种页面布局。对布局还不是很 OK 的我决...
弹性盒模型 弹性盒模型是CSS3新增的属性，设置display属性值为flex的元素为弹性盒模型对象。弹性盒子由弹...
课程思维导图 Flex 弹性盒布局 CSS3弹性盒布局的理解： web应用有不同设备尺寸和分辨率，这时需要响应式界...
本文标题：我用过的两种响应式设计：rem&弹性盒模型
本文链接：https://www.haomeiwen.com/subject/doosdxtx.html
网友评论