各个浏览器下select默认的下拉箭头差别较大,通常会清除默认样式,重新设计
<html>
<head>
<meta charset="utf-8"></meta>
</head>
<style>
.bar{
width:400px;
height:50px;
}
.labelSelect{
width:80px;
height:50px;
line-height:50px;
display:inline-block;
}
.mySelect{
width:300px;
height:50px;
border:1px solid #ccc;
display:inline-block;
}
/* --ie清除--*/
select::-ms-expand{ display: none; }
select{
border: 1px solid #E9E9E9;
appearance:none;//将默认的select选择框样式清除
-moz-appearance:none;
-webkit-appearance:none;
background: url("arrowDown.png") no-repeat scroll right center transparent;//在选择框的最右侧中间显示小箭头图片
padding-right: 20px; //为下拉小箭头留出一点位置,避免被文字覆盖<h