下拉框（Select）是網頁中常用的一種表單元素，用來讓用戶在幾個預定義選項中選擇一個。下拉框有時也稱為"下拉列表框"、"下拉菜單"等。

在實際開發中，我們經常需要定制下拉框的樣式，比如改變下拉框的寬度、高度、字體、背景顏色等。下面介紹如何使用 CSS 控制下拉框的尺寸。

<select style="width: 200px; height: 30px;">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

上面的代碼中，使用了 style 屬性來定義下拉框的寬度為200px，高度為30px。可以看到，設置下拉框的寬度直接使用 width 屬性即可，而高度則需要通過設置 padding 和 line-height 兩個屬性來實現。

同時，還要注意設置下拉框的 option 元素的高度，這樣才能保證下拉列表項正常顯示，否則默認的 option 高度將會失效。

<style>
select {
width: 200px;
height: 30px;
padding: 5px 10px;
line-height: 1.5;
font-size: 16px;
color: #333333;
background-color: #ffffff;
border: 1px solid #cccccc;
}
option {
height: 30px;
}
</style>
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

上述示例代碼定義了下拉框的尺寸、字體、顏色等樣式，包括選擇項的高度。成功地控制了下拉框的尺寸，顯示出令人滿意的效果。

通過使用 CSS 控制，我們可以輕松地定制下拉框的樣式，使之更符合用戶的需求和要求。