您的位置:首页 > 其它

隐藏select边框及下拉箭头方法

2012-12-08 13:47 671 查看
CSS样式:

.width5
{
width: 50px;
}
.width6
{
width: 60px;
}
.width7
{
width: 70px;
}
.width8
{
width: 80px;
}
.width9
{
width: 90px;
}

/*套在Select外层,用于隐藏Select框*/
.DivSelect
{
float:left;
position: relative;
background-color: transparent;
height: 17px;
overflow: hidden; /*隐藏了小三角,宽度为比select宽度少20px*/
border-width:0px;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-bottom-style: none;
}

/*设置Select样式*/
.SelectList
{
position: relative;
background-color: transparent;
TOP:   -2px;
left:-2px;
border-width: 0px;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-bottom-style: none;
display:block;
height: 20px;
overflow:hidden;
}


前台代码:

<div class="DivSelect width5">
<select  class="SelectList width7">
<option>双铜纸</option>
<option>双胶纸</option>
</select>
</div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: