Question

<select id="selectId" name="name1" style="height:10% !important;" >
    <option>Select One</option>
    <option>xxx</option>
    <option>yyy</option>
    <option selected="selected">rrr</option>
    <option>ggg</option>
    <option>fff</option>
    <option>qqq</option>
</select>

如何设置选择的宽度和高度。我正在使用jquery mobile css，我无法完成这项工作。请帮帮我

提前致谢

Answer 1

您需要更改此css类.ui-select试试这个：

.ui-select{
  width:200px;
  height:70px;
}

检查Demo

如果你只想影响那个选择，那么在Jquery中使用id作为目标：

$(document).ready(function(){
  $('#selectId').closest('.ui-select').addClass('select_small')
})

有了这个，你可以添加这个类：

.select_small{
  width:200px;
  height:70px;
}

检查另一个 DEMO

Answer 2

尝试指定精确的高度，例如100px，或者如果您希望它具有百分比，请确保您的容器也具有高度。

<select id="selectId" name="name1" style="height:100px !important;" >

http://jsfiddle.net/F2952/

这样运行。

Answer 3

如果您坚持使用jquery，可以使用

$("#selectId").width("enter your width");
$("#selectId").height(enter your height);

Answer 4

select的高度似乎取决于options。所以，我会把它描绘成：

select option{height:50px}

Demo here

Jquery Mobile - 如何覆盖选择框的高度和宽度。

4 个答案: