select设置高度的兼容问题

在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>

　　

转载于:https://www.cnblogs.com/diligenceday/p/3899667.html