自定义select 小三角
程序员文章站
2022-03-03 12:18:54
把select小三角换成自己的图片 效果： css样式： HTML： ......
把select小三角换成自己的图片
效果：
css样式：
<style>
#my_select {
display: flex;
display: -webkit-flex;
width: 120px;
font-size: 24px;
padding: 0 5px;
margin: 20px auto;
outline: none;
border: 1px solid #00dd00;
appearance: none;
/* 兼容chrome */
-webkit-appearance: none;
background: url(images/xia.png) no-repeat right center;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
color: #ff5511;
}
</style>
html：
<body>
<select name="" id="my_select">
<option value="0">苹果</option>
<option value="1">香蕉</option>
<option value="2">橘子</option>
</select>
</body>