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}

在這里演示 。