【发布时间】：2013-11-18 14:01:51
【问题描述】：
我正在使用 Bootstrap 3，在移动视图中我想应用一些 CSS 来修复移动视图上的一些错误。我查看了文档并谷歌了它。我似乎找不到任何线索。
有可能吗？
【问题讨论】：
标签： css twitter-bootstrap responsive-design
【发布时间】：2013-11-18 14:01:51
【问题描述】：
只需在您的 CSS 中使用适当的媒体查询，例如
@media (max-width: 767px) {
/* CSS goes here */
}
Bootstrap 定义了以下宽度
- 超小型设备（手机，小于 768 像素）
- 小型设备（平板电脑，768 像素及以上）
- 中型设备（台式机，992 像素及以上）
- 大型设备（大型桌面，1200 像素及以上）
有关媒体查询的更多信息，请参阅http://css-tricks.com/css-media-queries/。
【讨论】：
还有响应式实用程序，您可以向某些元素添加类，以在某些视口大小显示或隐藏它们。
.hidden-xs or .visible-xs
【讨论】：
-
bootstrap 4 不再支持此功能。请在下面查看我的答案以获取新版本
您可以在Bootstrap 4 中使用响应式显示类https://getbootstrap.com/docs/4.3/utilities/display/
因此，例如，您想只为手机隐藏特定元素（纵向和横向模式或 xs 和 sm），您可以这样做
<div class="big_image d-none d-md-block">
</div>
它的作用是默认设置display:none，并使其仅在md 及以上可见。
【讨论】：