如何设置所选选择输入的占位符颜色?
How to set color of placeholder of Chosen selection input?
在我的 jQuery v3 / Bootstrap v4.1.2 应用程序中,我使用 chosen.jquery(版本 1.8.7)但我没有找到如何设置占位符文本的颜色所选选择输入的样式如下:
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #c2c200 !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #c2c200 !important;
opacity: 1 !important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #c2c200 !important;
opacity: 1 !important;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: ##c2c200 !important;
}
::-ms-input-placeholder { /* Microsoft Edge */
color: #c2c200 !important;
}
::placeholder { /* Most modern browsers support this now. */
color: ##c2c200 !important;
}
我用代码初始化它:
$(".chosen_select_box").chosen({
disable_search_threshold: 10,
allow_single_deselect: true,
no_results_text: "Nothing found!",
});
你可以看这个fiddle:
http://jsfiddle.net/1Lpdk79r/3/
但它不适用于选定的输入。如何解决?
如果您查看 fiddle 的源代码,您可以看到 Chosen 插件从您的 select 生成文本输入,并将 placeholder
文本添加为输入值.它还为该输入设置样式。所以你只需要用你自己的样式覆盖 Chosen 样式。
这样就可以了,更改文本颜色:
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
color: #c2c200;
}
在我的 jQuery v3 / Bootstrap v4.1.2 应用程序中,我使用 chosen.jquery(版本 1.8.7)但我没有找到如何设置占位符文本的颜色所选选择输入的样式如下:
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #c2c200 !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #c2c200 !important;
opacity: 1 !important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #c2c200 !important;
opacity: 1 !important;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: ##c2c200 !important;
}
::-ms-input-placeholder { /* Microsoft Edge */
color: #c2c200 !important;
}
::placeholder { /* Most modern browsers support this now. */
color: ##c2c200 !important;
}
我用代码初始化它:
$(".chosen_select_box").chosen({
disable_search_threshold: 10,
allow_single_deselect: true,
no_results_text: "Nothing found!",
});
你可以看这个fiddle: http://jsfiddle.net/1Lpdk79r/3/
但它不适用于选定的输入。如何解决?
如果您查看 fiddle 的源代码,您可以看到 Chosen 插件从您的 select 生成文本输入,并将 placeholder
文本添加为输入值.它还为该输入设置样式。所以你只需要用你自己的样式覆盖 Chosen 样式。
这样就可以了,更改文本颜色:
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
color: #c2c200;
}