适用于小型设备的Twitter Bootstrap响应式导航栏标题

时间:2013-02-20 12:36:38

标签: javascript jquery html twitter-bootstrap

帖子的标题相当含糊......但我遇到的问题是,我在全宽时拥有的响应式导航栏不应该有“品牌”或“标题”。只有当在较小的设备上查看导航栏时,即在响应模式下,导航栏上才会有一个品牌说“菜单”......

很难掌握,因此我在JSfiddle创建了fullscreen mode也可以查看。我喜欢在响应模式下查看时的结果,但在正常模式下它看起来很混乱。 “菜单”这个词不应再存在了,那就没那么了。

// Ignore this comment

1 个答案:

答案 0 :(得分:1)

实际上很容易修复,请查看代码的这个JSFiddle分支:http://jsfiddle.net/sfAY6/

您可以应用一组实用程序CSS类来控制可见性,具体取决于设备,例如隐藏在桌面上但在较小的任何内容上都可见。

所以我修改了你的菜单链接:

<a class="brand hidden-desktop" href="#">Menu</a>

这会将您的菜单锚点隐藏在任何被视为桌面的设备上,但会在平板电脑和智能手机上保持可见。

请点击此处了解详情:http://twitter.github.com/bootstrap/scaffolding.html#responsive