html - Webkit 滚动条在选择框中不起作用

Question

在 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>

如何解决这个问题？

Answer 1

你不能解决这个问题，至少现在不能。你需要给 DOM 一个大小 2 来识别你想看到超过 2 个值，CSS 不支持。

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