我希望我网站的某些部分在移动设备上缩小。是否可以通过引导程序触发这些更改，而不是根据页面宽度手动添加响应式 css 规则？
例如，通过反复试验，我发现bootstrap3从固定宽度切换到可变宽度，并navbar在浏览器宽度小于767px. 我希望我的页面的其他一些元素同时设置样式。是否有一种自然/本机的方式可以从引导响应规则触发/继承这些更改，而不是手动添加
@media screen and (min-width: 767px)
问问题
6060 次
1 回答
6
最好的方法是将引导类合并到您的代码中。此外，使用实用程序类按设备显示和隐藏内容。他们将使用这些类隐藏或显示给定屏幕尺寸的 div：
.visible-phone
.visible-tablet
.visible-desktop
.hidden-phone
.hidden-tablet
.hidden-desktop
（手机 767px 及以下，平板电脑 979px 至 768px）。
更新：本周事情发生了变化，Bootstraps 新版本有不同的类：
旧 = .visible-phone 新 = .visible-sm
旧 = .visible-tablet 新 = .visible-md
旧 = .visible-desktop 新 = .visible-lg
旧 = .hidden-phone 新 = .hidden-sm
旧 = .hidden-tablet 新 = .hidden-md
旧 = .hidden-desktop 新 = .hidden-lg
在迁移指南中可以轻松查看更多更改
更新：以“可见”开头的新类已被弃用，取而代之的是规范 CSS 显示属性的类。见引导解释
于 2013-08-12T11:32:29.297 回答