实现方法：前端只写一套代码，通过媒体查询，指定不同分辨率下页面如何显示。
设计方案：通常需要确定一套主设计方案，然后针对不同分辨率指定布局及元素的兼容方式。
注意：
①B和C中，自适应和响应式只是归纳叫法，后文中提到的前端布局方法并不一一对应。做一个多分辨率适配产品时，前端布局通常需要多种方法结合，比如最常见的自适应 流式布局的结合。
②很多分享提到，响应式设计是指“一套设计方案，适配所有设备”，这种说法并不完全正确。响应式设计的核心是确保用户体验一致，当产品功能和交互较为复杂时，设计师可能需要输出多套设计方案。
1.3 各种布局的特点及适用范围
通过以上分析，显然不是所有的web端产品都需要响应式设计。应根据产品性质、用户设备、产品使用场景、公司资源（人力配置、时间预算、资金预算）等因素，合理选择产品设计方案。
二、屏幕断点根据产品设计需要，人为地把屏幕分辨率划分出多个临界点，这一系列临界点被称为屏幕断点。
2.1 分辨率占比统计
下图为百度统计的web端分辨率占比，可以看出占比较多的分辨率有：1920、1536、1366、1440、1600等。
下图为百度统计的移动端分辨率占比，可以看出占比较多的分辨率有：320、414、375、320等。
2.2 各大平台制定的屏幕断点
微软的屏幕断点：
微软设计文档中，划分的颗粒度较粗，仅将分辨率分为小、中、大三段。
