如何更改多选下拉列表按钮的颜色

时间:2017-04-10 09:54:04

标签: jquery html asp.net-mvc-4 fullcalendar

我正在使用多选下拉菜单,但我不知道如何更改默认灰色按钮的颜色,有人可以帮助我吗?

source = ...

2 个答案:

答案 0 :(得分:1)

代码:

           $('#myproject').multiselect({  

                    nonSelectedText: '- - -Select Project- - -',    
                    includeSelectAllOption: true,
                    maxHeight: 400,
                    dropUp: true,
                    buttonWidth: 230,
                    enableFiltering: true,
                    enableHTML: true,
                    buttonClass: 'btn small btn-primary',
                    templates: {
                    button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span> &nbsp;<b class="fa fa-caret-down"></b></button>',
                    ul: '<ul class="multiselect-container dropdown-menu"></ul>',
                    filter: '<li class="multiselect-item filter"><div class="input-group"><span class="input-group-addon"><i class="fa fa-search"></i></span><input class="form-control multiselect-search" type="text"></div></li>',
                    filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default btn-white btn-grey multiselect-clear-filter" type="button"><i class="fa fa-times-circle red2"></i></button></span>',
                    li: '<li><a tabindex="0"><label></label></a></li>',
                    divider: '<li class="multiselect-item divider"></li>',
                    liGroup: '<li class="multiselect-item multiselect-group"><label></label></li>' }

答案 1 :(得分:0)

1.first  add one id to your button
function showCheckboxes1() {
         $('#lstFruits').multiselect({
  templates: {
   button: '<button type="text" id="mutiselectButton" class="form-control multiselect dropdown-toggle" data-toggle="dropdown" ><span class="multiselect-selected-text"></span> &nbsp;<b class="fa fa-caret-down"></b></button>',
             }
        });
2.Then in html file, 
 button#mutiselectButton{

    text-align: left;
    background: linear-gradient(to bottom, #fff 0%, #fff 100%);
    color: #555;
    border: 1px solid #ccc;
    text-shadow: 0 0 0 #fff;
    box-shadow: none;

}