减少HTML中下拉的字体大小

Question

我的HTML页面中有下拉菜单，它的宽度大于250像素。

我需要更改下拉字体大小，以便减小宽度。

我尝试使用字体标签象下面这样：

<font size='6'> 
    <select> 
    <option></option> 
    . 
    . 
    . 
    </select> 
</font> 

上面的代码没有工作。

当我试图通过将值硬编码为width = '50'来减小宽度时，它隐藏了所有下拉列表的全部内容，这些下拉列表变得很难选择特定的选项。

建议解决方案，使宽度减小，并在下拉列表中显示所有选项。

注：它应该是兼容IE8的

Answer 1

要更改字体大小，只适用font-size:XXpx; CSS属性：

<select style="font-size:6px;"> 
 
    <option>option1</option> 
 
    <option>option2</option> 
 
    <option>option3</option> 
 
</select>

或者，如果你想要把它在你的样式表中：

select{ 
 
    font-size:6px; 
 
}

<select> 
 
    <option>option1</option> 
 
    <option>option2</option> 
 
    <option>option3</option> 
 
</select>

Answer 2

尝试这种简单的方法 外部样式表方法

select{font-size:6px;}

<select> 
 
    <option>option1</option> 
 
    <option>option2</option> 
 
    <option>option3</option> 
 
</select>

内联的样式表的方法

<select style="font-size:6px"> 
 
     <option>option1</option> 
 
     <option>option2</option> 
 
     <option>option3</option> 
 
    </select>

Answer 3

使用CSS font-size规则您select - 元素

<select style="font-size: 6px"> 
    <option>ABC</option> 
    <option>ABC</option> 
    <option>ABC</option> 
    <option>ABC</option> 
</select> 

这里有一个Fiddle

Answer 4

在选择标签使用下面给出的CSS样式。

<select style="font-size:6px"> 
    <option></option> 
    . 
    . 
    . 
    </select> 

Answer 5

您可以使用CSS。

实施例：https://jsfiddle.net/9ddaexpz/

HTML：

<select id="myDropdown"> 
    <option>foo</option> 
    <option>bar</option> 
</select> 

CSS：

#myDropdown 
{ 
    font-size: 6px; 
}