Bootstrap Studio 如何正确使用网格？Bootstrap Studio for Mac使用教程

Bootstrap Studio是目前最受欢迎的网页设计工具之一。网格是最重要的Bootstrap功能，也是初学者最容易被误解的框架部分。对于构建响应式网页并根据设备的屏幕大小定义它们的缩放比例至关重要。Bootstrap Studio拥有响应式网格，使您在节省时间的同时提高生产力。那么Bootstrap Studio for Mac如何正确使用网格，下面小编为大家带来Bootstrap Studio 使用教程，感兴趣的朋友快跟着小编一起来看看吧！

Bootstrap Studio 如何正确使用网格？

快速调整大小
您可以按主工具栏上的按钮快速调整舞台大小，使其与网格大小相匹配。通过这种方式，您可以更快地测试和迭代设计。

行和列可视化
Bootstrap Studio向您显示行和列的轮廓，这可以帮助您编辑布局。

您可以在工具栏上打开或关闭该图表：

列工具栏
当您在Bootstrap Studio中选择一个列时，列工具栏会弹出。这是一个强大的工具，它控制当前活动屏幕大小的列的宽度和偏移量。

强大的选项
选中某一列时，“选项”面板将显示大量控制列宽度，偏移量，对齐方式和顺序的选项。

点击标签展开组并显示所有屏幕尺寸。如果没有为特定大小设置值，则上面的值会影响它：

此列仅占用MD设备中较大的一半宽度（12个中的6个）。

响应式显示

Bootstrap为我们提供了许多用于显示或隐藏元素的类，具体取决于屏幕大小。您可以在“ 选项”面板的“ 响应显示”组下面看到它们。

将列拆分为新行（Clearfix）

对于某些布局，您需要将列清除到单独的行。这就是Bootstrap Studio为您提供Column Helper组件的原因。您只需将其拖放到两列之间，并为其提供正确的响应式显示类，以限制它何时处于活动状态。

Bootstrap Studio Mac特别版下载地址可以在本页面获取。