收缩选择，多箱的宽度

Question

一个在多选择框中的项目比别人更长的时间，有没有办法破解它做它的宽度小

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

Answer 1

你可以做这与CSS，无论是内联风格还是使用类。

随着内嵌样式：

<select style="width: 50px;"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

使用类：

<select class="narrow"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

而在你的CSS文件或嵌入的样式表：

.narrow { 
width: 50px; 
} 

当然，改变50像素到无论你需要什么宽度。

Answer 2

您可以使用CSS设置宽度。如果你添加一个类选择标签，比如“富”，可以再加入CSS：

select.foo { 
    width: 200px; 
} 

如果你想可以使用内嵌样式（不推荐虽然）：

<select style="width: 200px";> 
    <option>... 
</select> 

Answer 3

试试这个，在FireFox中可用，但在IE中不可用：

<STYLE type="text/css"> 
    OPTION.shorter{ font-size:8px;} 
</STYLE> 

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option class="shorter">item is really long</option> 
<option>item</option> 
</select>