twitter bootstrap类visible- *不适用于手机和平板电脑

时间:2015-01-20 16:25:16

标签: css twitter-bootstrap responsive-design

我试图在这样的div上使用visible-xsvisible-smvisible-md

<div class="badge" class="visible-xs visible-sm">text</div>

但这似乎不适用于手机或平板电脑,但在台式机上,当我使用窗口操作时,这种方法有效,在移动设备上,当我将浏览器切换到&#34;显示为桌面& #34 ;.

奇怪的是,其他一切都有效,甚至是班级hidden-*

有没有人有任何建议,如何解决?

3 个答案:

答案 0 :(得分:1)

visible-*应该适用于移动设备。

请给我们举个例子。

答案 1 :(得分:0)

根据Twitter Bootstrap的网站:http://getbootstrap.com/css/#responsive-utilities-classes

如果您使用的是当前版本的Bootstrap:3.2.0,现在它已不再是犹太洁食了。它 仍然可以工作,但您可能想尝试.visible-sm-* * 通常是块,内联或内联块的占位符。例如:.visible-sm-inline

话虽如此,我发现离开 * 也有效。例如:.visible-sm-*会隐藏小型设备上的内容。

答案 2 :(得分:0)

不要在div上使用多个类块,否则它只会获得第一个类名。试试这样:

<div class="badge visible-xs visible-sm">text</div>

见:

http://www.w3.org/TR/html5/dom.html#classes