如何调整 DropDown <select> 框的宽度？

Question

我需要在不使用 css 的情况下调整选择 HTML 框的宽度，有办法吗？我尝试了尺寸，但随后它调整了高度，而宽度却没有任何作用？还有别的办法吗？

Answer 1

无法按照 http://www.w3.org/TR/html401/interact/forms.html#h-17.6 在纯 HTML 中执行此操作。您可以使用 style 元素来设置它，尽管它是内联的，因此有点没有 css。

<select style="width: ....

Answer 2

<style type="text/css">     
    select {
        width:200px;
    }
</style>

这不行吗？

Answer 3

添加一个空选项，其中有足够的空间...

Answer 4

如果你使用jquery， 数学 物理 化学

这是我选择的 html 代码。所以你必须添加另一个包含jquery类名（包括你的类名）的div，并在你的类中应用高度和宽度。

<div class="ui-select selBox"> 
    <select>
    <option>Maths</option>
    <option>Physics</option>
    <option>Chemistry</option>
    </select>
</div>
.selBox{
 width: 470px !important;
 height: 40px !important;
}

这里 selBox 是我的类名，ui-select 是 jquery 类名。

Answer 5

更改字体大小

<select name="ships" id="ship-select" class="ships" style="font-size: 2rem;">

Answer 6

select
{
    width:  100%;
    height: 42px;
}

将此类添加到您的样式标签中。效果很好。