IT工程師數位筆記本

在IE678下，我們給select設置高度的話，里面的option無法居中，折中的兼容方式就是，我們給select的border:0；外面套一層div，這個div給他設置padding，讓select居中，但是IE67個select設置的border還是有問題，所以還要加一個遮住默認邊框的層（設置overfow:hidden）;ff和chorme按照正常的設置line-height就可以了;
IE8和IE8一下的用
<!--[if IE 8]>
<![endif]-->
這種寫法就好了


<style type="text/css">

.standard_select{ /*邊框*/
	display:inline-block;
	border:solid 1px #E3E9EF;
	border-top-color:#ABADB3;
	padding:5px; /*調整此處改變select高度*/
}
.select_shelter{ /*遮擋默認邊框*/
	display:inline-block;
	width:100px;
	*width:98px;
	height:20px;
	overflow:hidden;
}
.select_shelter select{
	*margin:-2px;
	padding:1px;
	border:0px;
	width:100px; /*select的寬度*/
}

</style>

<span class="standard_select"><!--邊框-->
	<span class="select_shelter"><!--遮擋默認邊框-->
	<select>
		<option value="papername" selected="selected">SELECT選項標簽</option>
		<option value="state">選項二</option>
		<option value="state">選項三</option>
		<option value="state">選項四</option>
		<option value="state">選項五</option>
		<option value="state">選項六</option>
	</select>
	</span>
</span>