请问能否去掉下拉框里面的滚动条?

<body onload="document.all.a1.size=document.all.a1.options.length">
<select name="a1" size="1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">a</option>
<option value="11">b</option>
<option value="12">c</option>
<option value="13">d</option>
<option value="14">e</option>
<option value="15">f</option>
<option value="16">g</option>
<option value="17">h</option>
<option value="18">i</option>
</select>

解决方案 »

  1.   

    楼上的变成列表框而非下拉框了，不行用zoom属性是可以的，不过zoom会使下拉框占用相当大的空间，也不合适似乎没有好的方法
      

  2.   

    我有 很笨 但是可以达到效果
    全部用js div 表格模拟一个 select
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function show(){
    menu.style.visibility="visible";
    }
    function hidden(){
    menu.style.visibility="hidden";
    }
    function textp(e){
    var thetext=e;
    if (thetext.length>4){
    var thetext2=thetext.substr(0,4)
    text1.innerText =thetext2;
    }
    else{
    text1.innerText =e;
    }
    menu.style.visibility="hidden";
    }
    //-->
    </SCRIPT>
    <style type=text/css>
    td {font-size:9pt;}
    .in{ position:relative;z-index:1; top:2px; left:2px; color:#000000; width:50px; }
    .in1{ position:relative; z-index:2;top:1px; left:0px; color:#428EFF; font-weight:bold; visibility="hidden";height:100px;width:120px;;border:1px solid black}
    .in3 { background:#ffffff;cursor:hand;width:80px;border:2 inset #ffffff;}
    .in4 { background:#000099;color:#ffffff}
    .in5 {}
    </style>
    </HEAD><BODY>
    <FORM METHOD=POST ACTION="" name="form1">
    <table class=in3 onclick="show();">
    <tr>
    <td><span id="text1">书籍</span>
    </td>
    <td align="right"><IMG SRC="tridown.gif" WIDTH="10" HEIGHT="5" BORDER=0 ALT="">
    </td>
    </tr>
    </table>
    <div id="menu" name="menu" class="in1" onMouseOver="show();" onMouseOut="hidden();"><table border="0" >
    <tr>
    <td id="yy1" onClick="textp('书籍');"  onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 书籍
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('世界各国政治情况');" onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 世界各国政治情况
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('中国政治情况');" onmouseover="this.className='in4'" onmouseout="this.className='in5'">中国政治情况
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('俄罗斯政治情况');" onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 俄罗斯政治情况
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('韩国政治情况');" onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 韩国政治情况
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('英格兰政治情况');" onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 英格兰政治情况
    </td>
    </tr>
    <tr>
    <td id="yy2" onClick="textp('文学世界');" onmouseover="this.className='in4'" onmouseout="this.className='in5'"> 文学世界
    </td>
    </tr>
    </table>

    </div>
    </FORM>
    </BODY>
    </HTML>