Twitter Bootstrap как вертикальная панель навигации на стороне

Я новичок в бутстрапе, и у меня возникла проблема с созданием навигационной панели, такой как bootstrap. Я потратил много времени на ее попытки, но не смог разобраться. То, что я хочу, какTwitter Bootstrap как вертикальная панель навигации на стороне

enter image description here

Это то, что я нашел here

<div class="span3 bs-docs-sidebar"> 
<ul class="nav nav-list bs-docs-sidenav affix"> 
    <li class="active"><a href="#dropdowns"><i class="icon-chevron-right"></i> Dropdowns</a></li> 
    <li class=""><a href="#buttonGroups"><i class="icon-chevron-right"></i> Button groups</a></li> 
    <li><a href="#buttonDropdowns"><i class="icon-chevron-right"></i> Button dropdowns</a></li> 
    <li><a href="#navs"><i class="icon-chevron-right"></i> Navs</a></li> 
    <li><a href="#navbar"><i class="icon-chevron-right"></i> Navbar</a></li> 
    <li><a href="#breadcrumbs"><i class="icon-chevron-right"></i> Breadcrumbs</a></li> 
    <li><a href="#pagination"><i class="icon-chevron-right"></i> Pagination</a></li> 
    <li><a href="#labels-badges"><i class="icon-chevron-right"></i> Labels and badges</a></li> 
    <li><a href="#typography"><i class="icon-chevron-right"></i> Typography</a></li> 
    <li><a href="#thumbnails"><i class="icon-chevron-right"></i> Thumbnails</a></li> 
    <li><a href="#alerts"><i class="icon-chevron-right"></i> Alerts</a></li> 
    <li><a href="#progress"><i class="icon-chevron-right"></i> Progress bars</a></li> 
    <li><a href="#media"><i class="icon-chevron-right"></i> Media object</a></li> 
    <li><a href="#misc"><i class="icon-chevron-right"></i> Misc</a></li> 
</ul>

источник

2013-06-15 vaibhav1312

, что сделал и пытался до сих пор? –

Так что же не работает? Вы хотите, чтобы меню «прикреплялось» к стороне следующим образом: http://www.bootply.com/63708 – ZimSystem

ли проверить у самозагрузки нав бар -> наращиваемых раздел, here?

<ul class="nav nav-tabs nav-stacked"> 
    ... 
</ul>

Похож на то, что вы просили ... попробовал?

источник

2013-06-15 14:42:10

Да, я попробовал, и он дает сложенные вкладки, но это не то, что я хочу – vaibhav1312

, так что же вы хотите? ? –

Я хочу, как и выше снимок (из бутстрапа) – vaibhav1312

Скопируйте css bs-sidebar из docs.css twitter bootstrap; добавить дополнительный CSS, который определяется отдельно в нижней части того же файла, как показано ниже:

CSS

.bs-sidebar .nav > .active > ul { 
    display: block; 
    margin-bottom: 8px; 
}

HTML

<div class="bs-sidebar affix"> 
    <ul class="nav bs-sidenav"> 
     <li class="active"><a href="#">NAV1</a> 
      <ul class="nav"> 
       <li><a href="#">1</a></li> 
       <li><a href="#">2</a></li> 
      </ul> 
     </li> 
     <li><a href="#">NAV2</a></li> 
    </ul> 
</div>

источник

2013-07-31 16:12:50

Ваш ответ спас мой день тоже. Теперь мне просто нужно получить цвет. – DrinkJavaCodeJava

Twitter Bootstrap как вертикальная панель навигации на стороне

ответ

Смежные вопросы