怎么设置<select>下拉列表的背景和下拉的小三角样式
3个回答
展开全部
select {
/*背景：和其他元素一样，都是设置 background 属性*/
background:#F00
/*三角1：先将默认的select选择框样式清除*/
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
/*三角2：在选择框的最右侧中间显示小箭头图片*/
background: url('XXXXXX/XXXXXX/XXXXXX/xxxxxx.png') no-repeat scroll right center transparent;
/*三角3：为下拉小箭头留出一点位置，避免被文字覆盖*/
padding-right: 14px;
}
/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none; }
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
css设置下拉列表(select)样式：
首先需要获取到这个元素的id或者是class，然后在通过给这个元素设置它的width和height等等一些样式，具体的看代码:
<html>
<head>
<style>
.div1{
width:600px;
height:200px;
font-size:13px;
}
.div select{
width:200px;
}
.div select option{
width:150px;
height:30px;
}
</head>
<body>
<div class='div1'>
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用css里面的边框设置，修改SELECT标记的属性，设置背景图为小三角图片。
参考资料： http://www.wand.com
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
