1

Twitterブートストラップを使用して、スナップショットで次のように見えるサイドナビゲーションを作成したいと思います。ここで注意すべき特別なことは、ラベルの名前が大きい場合、「....」に変換され、完全に表示されず、別の行に移動することです。また、可能であればリスト全体をスクロールする必要があります。誰もがそれを達成する方法を知っています。

ここに画像の説明を入力

4

2 に答える 2

2

クラス「navbaritem-ellipsis」を LI に追加し、これを CSS ファイルに追加します。

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

no-wrap は、テキストを次の行に折り返さないようにブラウザーに指示します。省略記号は、テキストが大きすぎる場合にテキストの末尾に「...」を追加するようブラウザに指示します。

于 2013-09-03T23:23:36.527 に答える
-2

まあ、ドキュメントはこれをかなりよく説明しています： http://twitter.github.com/bootstrap/components.html#navs

Web アプリの 1 つでサイド ナビゲーション バーを使用しています。基本的には、2 つの列を作成するブートストラップのグリッド レイアウトを使用しています。小さい方は左側にナビゲーション バー用に、もう 1 つはメイン コンテンツ用に右側に配置します。これはドキュメントにもあります: http://twitter.github.com/bootstrap/scaffolding.html#gridSystem

于 2013-03-01T14:33:06.837 に答える