撰稿编者按：在积极响应式单点掌控系统中，PT5716SB0是掌控网页展开产业布局变动的一连串值，对网页有著一定的影响。很多老师对PT5716SB0不知觉，译者归纳了有关PT5716SB0的应用，撷取给你。
我曾在之前的该文中为大家介绍过有关「积极响应式单点设计」的相关结构设计实战经验。前段时间我也把一些老师对于「PT5716SB0」基本概念的发问重新整理和撷取给你，希望对你有协助——
一、PT5716SB0的数目是否圣埃卢瓦？
不一定。PT5716SB0数目越多，商品在相同体积的网页中转换过程会越通畅，但是结构设计和开发的生产成本也会适当的增加。
PT5716SB0（Breakpoints）其实是掌控网页展开产业布局变动的一连串值。再简单点说，就是当网页类光两个PT5716SB0值时，网页的排印就会发生改变。
有关PT5716SB0，你须要建立以下知觉基本概念：
1. 通常情况下，这款商品的PT5716SB0数目在4-6 个为宜，因为如果如前所述每两个PT5716SB0都得出两套网页排印计划，那么PT5716SB0的数目越多，商品网页被剪切时的变动就会越通畅，同时商品的结构设计和投资生产成本也会越高。
2. PT5716SB0值，没当然的值规范化你能依照你商品的网页产业布局和体积来确定，也能按照你的使用者常用的电子设备来预设。你也能认为：当你的网页的长度被抬升变宽，使得排印产业布局不得已发生改变时，就能得出两个网页的PT5716SB0值。
举个范例，右图是某商品PT5716SB0值和网页效用事例，其中的 756px、974px 并并非常用值，但只要它们合乎商品的结构设计和功能须要，就能将其订为PT5716SB0值。或者说值并非有理数，不好记：
你能依照自己的商品结构设计须要，灵巧地规定相同PT5716SB0值下的单点科舞（Column）、边距（Margin）和长度（Gutter）的值，以及这些值之间的变动规律。
其实单点和PT5716SB0本身是结构设计方法，是用来协助商品做好适配的。所以单点计划要去匹配你的商品网页结构设计，才能更好地服务于商品，更好地展现商品在相同环境下的产业布局样式。
因此不建议用你的商品去套用其他已有的单点计划。每一商品都有个性，商品相关联的栅格解决计划也都是独一无二的。
二、PT5716SB0的实际应用事例
我以这款 B 端商品的PT5716SB0为事例，给你具体讲讲PT5716SB0的功能和应用方法。
这款商品使用的是相对简单的一种产业布局方式，见右图。我还是要再强调一次，右图中的单点方案并并非唯一的标准数学分析，仅为一种最适合这款商品的解决计划，供你参考（图有点小，可放大查看，下文也会有更清晰的大图）：
由于考虑到商品的特性和开发的难易程度，这套单点计划中预设了两个定值：列（Column）的数目始终为 12 栏；长度（Gutter）的长度始终是 24px：
先来讲讲这几个PT5716SB0值的含义。
1600px： 严格意义上来说，1600px 不算是两个PT5716SB0值。这是我们画结构设计稿使用的画布长度。网页中单点的最大总长度（也是有效的内容区）为 1280px：
也就是说当网页再被拉长时，单点的总长度始终为 1280px，只有边距（Margin）会不断增加。网页的内容产业布局不会发生改变：
当然，我们如果使用其他值比如 1440px 或 1400px 作为画布体积也是能的，其它值也会适当变动。
1344px： 这个PT5716SB0值用于确定网页边距的第两个固定长度是32px。当网页的长度从 1600px 向 1344px 的靠近时，网页的边距会不断缩小，直到达到 32px 这个最小值：
也就是说，当网页长度在 1344px-640px 之间变动时，边距始终是32px，改变的只是单点每一列的长度，网页的内容产业布局也不会发生改变：
640px：这个PT5716SB0值用于确定网页边距的第二个固定长度 16px。也就是说当网页长度小于等于 640px 时，边距始终是16px，只改变单点每一列的长度：
这时网页就适用于Pad 电子设备，网页的产业布局会在达到 640px 时展开直接改变：
375px： 这个PT5716SB0值用于确定内容区最小长度为 343px，不过这是建立在手机体积唯一的理想基础上。由于手机型号相同，所以实际上小于 343px 的内容区域也是存在的，能通过改变栏宽实现长度的变动：
这时网页就适用于手机电子设备，网页的产业布局会在达到 375px 时展开直接改变。也能依照商品的特点来决定是否沿用 640px 的产业布局样式：
所以我们能看到，整个商品有三个主要的PT5716SB0，产业布局有三种主要的样式：
当网页长度大于 640px 时是一种产业布局，即PT5716SB0 1344px 的网页产业布局样式（适用于 PC ）；当网页长度在 640px-375px 之间时是一种产业布局，即PT5716SB0 640px 的网页产业布局样式（适用于 Pad）； 当网页长度小于等于 375px 时，是一种网页产业布局样式（适用于手机）。我们现在所有的网页都使用 12 列单点，你也能依照你的商品结构设计样式，将 375px 网页中的 12 列单点变成 4 列单点。还是要再强调一次，这套单点计划及其中的数据并并非唯一的数学分析或行业标准，只是最适合这款商品的计划，仅供你学习参考：
我们在和开发做对接时，也是用这张图做讲解，让双方对产业布局规则达成一致，初步确定基础值和使用规范化。
#专栏作家#组件库Ant Design组件的结构设计和运营工作，目前负责国际业务线B端商品体验结构设计和组件库的搭建工作。
本文原创发布于人人都是商品经理，未经许可，禁止转载。
题图来自 Unsplash，如前所述 CC0 协议。
