Twitter bootstrap Twitter引导响应实用程序类的使用

Twitter引导响应实用程序类（如.visible desktop）应该如何使用。我试着在Bootstrap网站上学习这个例子

<span class="visible-desktop">✔ Desktop</span>

✔ 桌面

在这样的画面上,

<span class="visible-desktop">
  <img src="<%=(image_path('green.jpg'))%>"></img>
</span>

">

---

但是，当我将浏览器窗口缩小到平板电脑或手机大小时，图像仍会保留。

您是否复制/粘贴了代码？因为您有打字错误

<span class="visable-desktop">

应该是

<span class="visible-desktop">

这对我很有用-

尝试将

.hidden phone

和

.hidden tablet

添加到

span

类中，如下所示：

<span class="visible-desktop hidden-phone hidden-tablet"> </span>

---

如果所有依赖项都已就位并正确引用（CSS文件等），则类

.visible desktop

不应显示在平板电脑或手机上

在Bootstrap自己的介绍性文档的这一部分中，您可以看到一个实例：

尝试在一个非常简单的标记上应用该类，首先看看它是否工作。如果不工作，则不会在任何其他标记上工作。：）

---

祝你好运！

以防万一有人想用Bootstrap 3.0实现这一点。他们更改了这些类：

.visible phone

变成了

.visible sm

.visible tablet

变成了

.visible md

.visible desktop

变成了

.visible lg

.hidden phone

变成了

.hidden sm

隐藏的平板电脑

变成了

。隐藏的md

。隐藏桌面

变成了

。隐藏lg

用法：

<span class='hidden-sm hidden-md visible-lg'>

---

可以找到Bootstrap3.0迁移指南。

这是一个很好的图表，解释了如何在Bootstrap3.1中使用它们

---

您是否将

bootstrap responsive.css

stylesheet”包含在“

bootstrap.css

样式表？或者根本没有？是的，我已经正确地包含了样式表，并且其他响应功能正在工作。你能在上发布你如何使用它的设置吗？该类正被

显式隐藏！重要的

标志，并且应该覆盖该元素中的任何其他显示属性，因此肯定还有其他内容。我使用的是Ruby Gem bootstrap sass版本2.0.2，而不是官方的bootstrap发行版，在查看代码时，我注意到响应实用程序类没有！重要的旗帜。我假设这对应于bootstrap 2.0.2。有人知道这是否是bootstrap 2.0.3中纠正的问题吗？该标志位于

bootstrap responsive.css

ver2.0.3样式表中，在尝试类似的操作之前，我会尝试更新bootstrap

.visible destop

类应该完成本答案中提到的其他两个类的工作，因此在实践中，它应该是

.visible destop

本身或

.hidden phone

和

hidden tablet