字形扳手下拉菜單

Question

我只是想知道如果有人知道如何創建一個可點擊（插入旁邊）glyphicon（扳手）與一個很好的下拉菜單選擇？任何見解都會很棒！

爲glyphicon扳手目前代碼：

<a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
     <span class="glyphicon glyphicon-wrench"></span> 
     <b class="caret"></b> 
    </a> 

         <ul class="dropdown-menu"> 
         <li><a href="http://www.jquery2dotnet.com">Action</a></li> 
         <li><a href="http://www.jquery2dotnet.com">Another action</a></li> 
         <li><a href="#">Something else here</a></li> 
         <li class="divider"></li> 
         <li><a href="#">Separated link</a></li> 
         <li class="divider"></li> 
         <li><a href="#">One more separated link</a></li> 
         </ul> 

當我點擊插入符號，我似乎並沒有得到一個下拉菜單。我在這裏錯過了很明顯的東西嗎

Answer 1

我在這裏錯過了一些明顯的東西嗎？

你已經錯過了.dropdown包裝它建立了absolute LY定位下拉菜單一個新的包含塊。

因此，下拉菜單現在相對於初始包含塊進行定位。你可以通過一個具有<div>.dropdown類，如下所示包裹的元素：

EXAMPLE HERE

<div class="dropdown"> 
    <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
    <span class="glyphicon glyphicon-wrench"></span> 
    <b class="caret"></b> 
    </a> 
    <ul class="dropdown-menu"> 
    <!-- items here... --> 
    </ul> 
</div> 

---

_{甲position屬性比static以外的值建立一個新的包含塊。 Twitter Bootstrap默認將position: relative應用於.dropdown。}