相信很多B端设计师都很关心B端响应式界面设计，所以今天就来分享B端响应式界面设计的一些知识。
B端响应式是什么
响应式是网站为了让内容适配浏览器画布尺寸而使用的技术，即内容的区域会随着浏览器窗口的变更而变更，从而提升用户体验。B端响应式和一般展示型网站的响应式有很多的不同之处。
B端的响应式设计不仅仅是让内容能自动匹配显示而已，还要兼顾操作合理性和用户体验。
响应式规则解析
解读响应式设计，最好的参考对象，就是AntDesign的布局相关规范了（这个可以到网上查找）。Ant中主要应用左右工作区和上下工作区，响应式规则作用在工作区中的内容区域中。
栅格系统的基础应用，就是对内容模块分配指定数值的 “列”，比如一个组件的宽包含 3 col、4 col、5 col 或者 12 col。也就是说，在同一行中，总共包含 24 col，随便设计师切割出多少模块出来，只要最后总数相加是 24 即可。
例如一开始设计的页面中，创建了1440px的画布，使用左右布局的形式，左侧使用 200px 宽的导航栏，右侧区域宽度为 1192px，间距为 8px，列宽就是 42px。在这之后，内部层次更低的表格、输入框、标签栏等元素也会对应实现响应的效果。
上面的内容可能很多人都不太理解，无论是 Ant 还是任何成熟的 B 端响应式框架，都需要我们了解栅格和前端对应技术。大家如果感兴趣的话可以到Ant 规范中查看设计、组件中的布局部分，尝试去理解它们。
栅格和响应式的共同结合对于前端程序员也有非常高的要求，随着标准化组件的增加，代码会越来越难维护，产生的问题也会越来越多。
响应式使用建议
响应式的应用，简单来说是为了让业务内容可以正常的显示。所以尽量提高效率，不要将栅格系统和响应式混合使用。在常规项目中，对响应式功能的应用只需要关注视图拉伸。
“视图”可以是手机客户端开发中的 View，也可以是网页前端中的 Div，文本编辑器中的 Block，即选中设计元素时的外部边框。
对于一般项目，使用这种基础的响应式方法即可，尽量避免使用 Breakpoint 概念去制作多个响应的布局内容，不仅设计工作大量增加，而且后期维护成本极高。
如果有想要支持手机访问的需求，建议放弃在同一套设计中使用响应式布局适配手机，而是和产品、开发沟通，提供一套独立的手机设计内容。
