Question

我有一个ASP.NET面板，我有列表框。面板宽度是固定的。问题是垂直条没有隐藏，因为宽度很小。看看这个例子。 http://jsfiddle.net/UnkEG/17/

是否有办法让水平条和垂直条始终可见？请告诉我。

div{   
    overflow-y:hidden;
}

<div style="width:140px;">
    <select name="selectbox" size="5"  id="selectbox" >
        <option value="1">one two three four five six seven eight</option>
        <option value="2">seven eight</option>
        <option value="3">nine ten</option>
        <option value="1">one two three four five six</option>
        <option value="2">seven eight</option>
        <option value="3">nine ten</option>
        <option value="1">one two three four five six</option>
        <option value="2">seven eight</option>
        <option value="3">nine ten</option>
        <option value="1">one two three four five six</option>
        <option value="2">seven eight</option>
        <option value="3">nine ten</option>
    </select>
</div>

Answer 1

使用overflow: visible，

或者分别为x和y设置

overflow-x: visible
overflow-y: visible

注意：溢出属性在IE8及更早版本中无法正常工作。

Answer 2

喜欢这个吗？

<强> CSS

div{
    width: 150px;
    height:100px;
    overflow:scroll;
}

<强> HTML

<div>
    <select size="9">
        <option>Option 1 Option 1 Option 1</option>
        <option>Option 2 Option 2 Option 2</option>
        <option>Option 3 Option 3 Option 3</option>
        <option>Option 4 Option 4 Option 4</option>
        <option>Option 5 Option 5 Option 5</option>
        <option>Option 6 Option 6 Option 6</option>
        <option>Option 7 Option 7 Option 7</option>
        <option>Option 8 Option 8 Option 8</option>
        <option>Option 9 Option 9 Option 9</option>
    </select>
</div>

<强> JSFIDDLE DEMO

如何在HTML Select上显示垂直条

2 个答案: