方法1:相对容器绝对定位,top为容器高度50%,margin-top设置为下拉列表的高度的1/2
<div style="width:300px;height:200px;background:red;position:relative; ">
<select style="position:absolute;top:50%;margin-top:-11px;height:22px;">
<option>11</option>
<option>11</option>
<option>11</option>
</select>
</div>
方法2:使用line-height,父容器高度与行高都设置为200
本来觉得这样就可以,事实不是这样的,如果容器中只有<select>,还是向上贴近父容器显示,但是只要加上一些其他内容
如文本、空格、或其他标签,就可以居中了,让人困惑的时父容器中有两个下拉列表时也能居中,
效果是出来,至于原因还是真是不清楚
<div style="width:300px;height:200px;background:green;line-height:200px;">
<select>
<option>11</option>
<option>11</option>
<option>11</option>
</select>
</div>