在 Bootstrap 响应式布局中隐藏元素

通过优化各种屏幕尺寸上的内容可见性来增强 Bootstrap 设计。 Bootstrap 提供了在较小设备上显示菜单项的功能，但是其他页面元素呢？

为了解决这个问题，Bootstrap 提供了“可见”和“隐藏”类，使您能够根据屏幕动态显示或隐藏元素尺寸。可用的类包括：

可见类：

• .visible-xs-block：在超小型设备（手机）上显示
• .visible-sm-block：在小型设备（平板电脑）上显示
• .visible-md-block：在中型设备上显示(桌面)
• .visible-lg-block: 在大型设备上显示(桌面)

隐藏类:

• .hidden-xs：在超小型设备（手机）上隐藏
• .hidden-sm：在小型设备上隐藏（平板电脑）
• .hidden-md：在中型设备（台式机）上隐藏
• .hidden-lg：在大型设备（台式机）上隐藏

隐藏要在较小的屏幕上使用导航药丸，只需将 .hidden-xs 类添加到相应的容器中即可。

...

或者，您可以使用“hidden-*-down”类，该类隐藏指定断点处的元素或较小。

...

记住使用如果您想在指定断点或更宽的位置显示元素，请使用“visible-*-up”类。

有关 Bootstrap 响应式实用程序类的更多信息，请参阅其官方文档：http://getbootstrap.com /css/#responsive-utilities.