我使用jQuery
選擇爲我的multi-select
框。不過,我發現chosen.css
文件中預先定義的樣式有點難以覆蓋,完全擺脫chosen.css
也可能不是一個很好的選擇。如何風格jQuery的選擇框
這裏是我的小提琴: https://jsfiddle.net/k1Lr0342/
HTML:
<select class="chosen" multiple="true" style="height: 34px; width: 280px">
<option>Choose...</option>
<option>jQuery</option>
<option selected="selected">MooTools</option>
<option>Prototype</option>
<option selected="selected">Dojo Toolkit</option>
</select>
CSS:
.chosen-choices {
border-radius: 3px;
box-shadow: inset 0px 1px 2px rgba(0,0,0,0.3);
border: none;
height: 34px !important;
cursor: text;
margin-top: 12px;
padding-left: 15px;
border-bottom: 1px solid #ddd;
width: 285px;
text-indent: 0;
margin-left: 30px;
}
我試着直接寫CSS的.chosen-choices
ul
。有些作品喜歡border-radius
和box-shadow
。但其他人:margin, height, padding, border
等被chosen.css
文件覆蓋。一種選擇是將!important
用於每個不起作用的設置。這將適用於大多數東西,但仍然不是高度。有什麼想法嗎?
我想你應該包括以下chosen.css您新的CSS將解決您的問題。你嘗試過嗎? – ketan
@ketan我試過了。它似乎沒有工作,雖然 –