布局实施建议

Bootstrap包含数十个用于显示、隐藏、对齐和间隔的实用工具，可加快移动设备与响应式界面的开发。

display块属性定义

我们可以方便的调用 display 属性的定义，与系统的栅格系统结合，来决定模块是否显示，甚至进一步属性如 .display- ，其中是可以1-12的任意数字。

Flexbox 选项

Bootstrap 4 基于flexbox流式布局,大多数组件都支持flex流式布局定义， 但不是所有元素的 display 都是默认就启用 display: flex 属性的(如果那样会增加很多不必要的DIV层叠，并会影响到浏览器渲染)。

如果您需要添加display: flex到DIV元素中，请使用.d-flex、或其中一个响应变体（如.d-sm-flex）就有启用。您将需要此类或display值，以允许使用我们的额外的flexbox实用程序来调整大小，对齐，间距等

Margin 和 padding间隙定义

Bootstrap 4包括一个用于音障实用程序的5种规格定义，使用margin 和 paddingCSS函数来控制元素和组件的间隔和大小，基于1rem值默认$spacer变量,选择所有视口（例如，值.mr-3对应于margin-right: 1rem），或挑响应变种，以针对特定的视口（例如，.mr-md-3对于margin-right: 1rem处于起步md断点）。

可见性切换

如果不使用 display 对元素进行隐藏（或无法使用时），你可以使用 visibility 这个BootStrap 可见性工具来对网页上的元素进行隐藏，它有collapse、hidden、visible三种属性，对应隐藏展示、隐藏元素、默认展示三种效果，使用它后网页元素对于正常用户是不可见的，但元素的宽高占位依然有效。