如何自定義jquery select2插件 - 選擇框的jQuery替換

我正在尋找一種方法來自定義項目中Select2的外觀。已查看過文檔，但找不到有關如何更改選擇框樣式的任何特定說明。如何自定義jquery select2插件 - 選擇框的jQuery替換

請看下面的圖片，用紅色圈出來，是選擇框的select2替換。我想更改邊框樣式，並使其看起來與頁面上的其他文本框相似。

注：我使用AngularJs並創造了選擇2鏈接，這樣一個指令：

。

directive('select2', function() { 
     return { 
      restrict: 'A', 
      require: 'ngModel', 
      link: function (scope, element, attrs, ngModelCtrl) { 
       element.select2({ 
        allowClear: true, 
        width: 'resolve' 
       }); 
      } 
     }; 
    });

下面是HTML代碼：

<select select2 class="form-control" ng-model="select2" style="width:100%;"> 
       <option value="one">First</option> 
       <option value="two">Second</option> 
       <option value="three">Third</option> 
      </select>

enter image description here

來源

2015-07-21 Digitlimit

你可以發佈你的當前代碼嗎？演示會更好。 –

這是一個特殊問題嗎？確保包含樣式表_after_ select2 one – tjvr

@Manoj Kumar包含代碼 – Digitlimit

我想這應該是可以簡單地覆蓋現有的CSS規則。

.select2-container--default .select2-selection--single { 
    background-color: #fff; 
    border: 1px solid #aaa; //change the border here 
    border-radius: 4px; 
}

來源

2015-07-21 12:22:03

謝謝。爲我工作。 – Digitlimit

如何自定義jquery select2插件 - 選擇框的jQuery替換

回答

相關問題