由于Chrome中的线性渐变，因此选择是不可见的

Question

我有一个选择框，我使用线性渐变作为背景。在Firefox中一切正常，但在Chrome中，我必须悬停才能看到选项，因为文本是白色的，背景也是白色的。见下图：

我想在删除线性渐变时，因为我无法使用jQuery，Javascript或PHP就可以了。有人知道解决这个问题的最佳方法吗？

这是codepen的帮助。

＆＃13;

＆＃13;

select {
    color: #fff;
    background-color: #12964f;
    background: linear-gradient(#4eba71, #12964f);
}

＆＃13;

<select name="" id="">
    <option value="">first value</option>
    <option value="">second value</option>
    <option value="">third value</option>
</select>

＆＃13;

＆＃13;

＆＃13;

Answer 1

select {
    color: #fff;
    background-color: #12964f;
    background: linear-gradient(#4eba71, #12964f);
}

select option {
  color: #000;
}

<select name="" id="">
    <option value="">first value</option>
    <option value="">second value</option>
    <option value="">third value</option>
</select>

您可以在选项中添加color:#000，这不会影响所选选项。

http://codepen.io/anon/pen/GWBOqx