javascript - Bootstrap Drop Down - 使用插入符号作为按钮

Question

我目前正在使用 Bootstrap 3.0 下拉菜单，它工作正常。目前，当我将鼠标悬停在文本或旁边的插入符号上时，它会显示菜单。但是我希望更改它，以便只有当我将鼠标悬停在插入符号上时它才会显示下拉菜单。

我的代码如下：

   <ul class="nav navbar-nav">
      <li class="dropdown">
         <a href='register'>Register Account</a>
         <a data-toggle="dropdown" class="dropdown-toggle"><b class="caret"></b></a>
         <ul class="dropdown-menu">
            <li><a>Bookmark</a></li>
            <li >Close</li>
         </ul>
       </li>
    </ul>

我的CSS代码是：

li.dropdown a.dropdown-toggle {
    display:inline-block;
}

a.dropdown-toggle:hover{
    display: block;    
}

Answer 1

从a标签中删除“注册帐户”文本，以便链接中只有插入符号：

<li class="dropdown">
    Register Account
    <a data-toggle="dropdown" class="dropdown-toggle">
        <b class="caret"></b>
    </a>
    ...
</li>

然后，您需要添加一些 CSS 以使插入符号与文本保持一致：

li.dropdown a.dropdown-toggle {
    display:inline-block;
}