在Asp.net中Bootstrap堆叠导航栏下拉列表

时间:2015-02-06 05:23:30

标签: jquery html css asp.net twitter-bootstrap

我是bootstrap的新手。 我正在尝试使用bootstrap对我的Asp.net页面进行编码 我想在页面的左侧创建下拉菜单。我在引导网站

中引用css代码 直到现在我试过这个 代码:

 <div class=" nav nav-pills nav-stacked">
     <ul class="navbar nav nav-pills nav-stacked"> 
     <li class="dropdown"><a href="#"  class="dropdown-toggle" id="button">Navigation<span class="caret"></span></a>

     <ul class="dropdown-menu" id="menu">
     <li><a href="#">sub item 1</a></li>
     <li><a href="#">sub item 2</a></li>
     <li><a href="#">sub item 3 </a></li>
     </ul></li> 
      <li><a href="#">home</a></li>
     </ul>
     </div>

当我运行代码子项目1,2,3隐藏在导航....但当我尝试单击导航菜单时没有任何反应。

1 个答案:

答案 0 :(得分:0)

看我也是bootstrap的新手。将您的代码更改为此。并告诉我它是否有效。我没试过这个。

    <div class=" nav nav-pills nav-stacked">
         <ul class="navbar nav nav-pills nav-stacked"> 
         <li class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
        Dropdown
        <span class="caret"></span>
      </button>

         <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul></li> 
          <li><a href="#">home</a></li>
         </ul>
         </div>