解决方法
如果你使用引导3,你可以在这里看到和工作的例子:
http://infinite-woodland-5276.herokuapp.com/index.html
http://infinite-woodland-5276.herokuapp.com/index.html
工作实例:http://codepen.io/igcorreia/pen/htdxl
HTML
<div class="container"> <div class="row"> <p class="lead">Roll over the button on the left to see a dropdown</p> Rollover dropdown: <!-- Our Special dropdown has class show-on-hover --> <div class="btn-group show-on-hover"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> Regular dropdown: <!-- Single button --> <div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> </div>
CSS
body{ padding:10px; } .show-on-hover:hover > ul.dropdown-menu { display: block; }