Webkit滚动条不适用于选择框

Jus*_*ohn 6 html css webkit css3

在webkit中,滚动条在单值选择框中不起作用,但在多个选择框中效果很好

CSS

::-webkit-scrollbar {
    width:  6px;
    height: 6px;
    background-color:transparent;
}
::-webkit-scrollbar-track {
    background-color:transparent;
    width: 6px;
}
::-webkit-scrollbar-track-piece  {
    background-color: transparent;
}
::-webkit-scrollbar-thumb {    
    background: none green;
    width: 6px;
}

HTML

    // Don't Works
<select>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>



// Works perfect for this   
<select size="2">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>
Run Code Online (Sandbox Code Playgroud)

如何解决这个问题呢 ?

Ivi*_*pić 0

你无法解决这个问题,至少现在不能。你需要给 DOM 一个大小 2 来识别你想要看到 2 个以上的值,CSS 不支持这一点。

我尝试使用“-webkit-scrollbar”、“-moz-scrollbar”、“-ms-scrollbar”、“-o-scrollbar”和直接“scrollbar”属性,得到了相同的结果。在不同的浏览器中有不同的行为。如果这部分对您来说非常重要,您需要使用 JavaScript 或 jQuery PLUGINS