自定义选择框上的黑色阴影

Question

我正在尝试在我的项目中使用fancySelect.js， FIDDLE HERE

我有以下HTML：

<select name="emergency-nos" id="emergency-nos">
    <option value="">Emergency numbers</option>
    <option value="">91 + test number</option>
    <option value="">91 + test number</option>
</select>

我正在初始化插件，如下所示：

$(function(){
    $('#emergency-nos').fancySelect();                
});

一切正常，除了点击选择框时有一个小故障，而且当您第二次点击时，选择框会按预期折叠，但选择框周围有一个黑色阴影，为什么我得到这个阴影，当选择框折叠？

那黑影真的有点破坏我的UI，我已经修改了很多css自己以适合我的主题，但没有做任何事情来添加那个黑影，任何人都可以解释为什么我会得到那个黑影？

谢谢。

亚历-Z。

Answer 1

从css中删除它：

div.fancy-select select:focus + div.trigger {
    box-shadow: 0px 0px 0px 2px #4B5468;
}

Answer 2

你的css上有一个box-shadow条目。

div.fancy-select select:focus + div.trigger {
    box-shadow: 0 0 0 2px #4B5468
}

您也可以隐藏select元素。