gpt4 book ai didi

jquery - 如何删除 Bootstrap 多选边框颜色

转载 作者:太空宇宙 更新时间:2023-11-03 22:21:25 25 4
gpt4 key购买 nike

我试图从 bootstrap multiselect 的选择框选项中删除边框颜色,但找不到任何在选项边框周围添加蓝色的类。

这个边框是当你点击选项或者你把它放在焦点上时出现的,这是我试过的

HTML

<body>
<select size="5" name="lstStates" multiple="multiple" id="lstStates">
<option value="NJ">New Jersey</option>
<option value="NY">New York</option>
<option value="OH">Ohio</option>
<option value="TX">Texas</option>
<option value="PA">Pennsylvania</option>
<option value="GG">asdfa</option>
<option value="AW">jghjh</option>
<option value="AE">qwer</option>
</select>
</body>

j查询

$(function () { 
$('#lstStates').multiselect({
buttonText: function(options, select) {
console.log(select[0].length);
if (options.length === 0) {
return 'None selected';
}
if (options.length === select[0].length) {
return 'All selected ('+select[0].length+')';
}
else if (options.length >=10) {
return options.length + ' selected';
}
else {
var labels = [];
console.log(options);
options.each(function() {
labels.push($(this).val());
});
return labels.join(', ') + '';
}
}

});
});

CSS

.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus {
color: #20262e;
text-decoration: none;
background-color: rgba(255,255,255,0.15);
outline: 0;
}

.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus {
color: #262626;
text-decoration: none;
background-color: rgba(255,255,255,0.15);
}

FIDDLE

enter image description here

最佳答案

蓝色是由用户代理样式表引起的:

:focus {
outline: -webkit-focus-ring-color auto 5px;
}

你可以在你的下拉菜单中覆盖它:

ul.multiselect-container li a:focus
{
outline-color: white;
}

更新 fiddle :http://jsfiddle.net/76wdfrbm/

关于jquery - 如何删除 Bootstrap 多选边框颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53447074/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com