jquery bootstrap下拉列表设置最大高度(bootstrap下拉菜单按钮显示选择项)

项目中需要点击弹出下拉框,使用了常用的bootstrap提供的Dropdowns下拉列表的插件,在使用中,为了设置表格的哪些列
需要隐藏与否,由于表格的列达到了50多行,点击之后,需要将整个界面下拉,导致很丑,所以需要重新修改下拉的样式,设置

其最大值高度为400px,以及设置可滚动,这样就不会有问题了,如下:

1.在style.css中修改下拉的样式,设置最大高度和可滚动:

/***
Dropdowns
***/
.dropdown-menu {
  position: absolute;
  top: 103%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  list-style: none;
  text-shadow: none;
  max-height: 400; //设置最大高度为400
  overflow:scroll;//设置可滚动
  padding: 5px;
  margin:0px;
  -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 8px rgba(120, 234, 61, 0.55);  
  font-size: 14px;
  font-family: "Segoe UI",Helvetica, Arial, sans-serif;
  border: 1px solid #ddd;
}

前后对比效果如下: