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

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;
}

检查演示

如果你只想影响那个选择使用id在Jquery中这样定位：

$(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}

在这里演示 。