如何使用twitter bootstrap创建侧栏

Question

我想创建一个侧面导航，使用twitter bootstrap在快照中看起来类似如下。这里要特别注意的是，如果标签的名称很大......它会转换为“......”而不是完全显示它并转到不同的行。如果可能的话，整个列表也必须滚动。任何人都知道如何实现它。

Answer 1

将类“navbaritem-ellipsis”添加到LI中，并将其添加到CSS文件中：

li.navbaritem-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: no-wrap;
}

no-wrap告诉浏览器不要将文本换行到下一行。省略号指示浏览者在文本末尾添加“...”，如果它太大。

Answer 2

嗯，文档很好地描述了这个： http://twitter.github.com/bootstrap/components.html#navs

我在我的一个网络应用程序上使用侧面导航栏 - 基本上使用bootstrap的网格布局创建两列。左侧是导航栏的一个较小的一个，右侧是主要内容的一个。这也在文档中：http://twitter.github.com/bootstrap/scaffolding.html#gridSystem