使用纯css更改下拉菜单的默认样式

目标样式：

代码：

<form> <select> <option>中国</option> </select> <select> <option>濮阳市</option> </select> <select> <option>南乐县</option> </select> <select> <option>韩张镇</option> <option>韩张</option> </select> <a href="#"><span class="so">搜索</span></a> </form> select{     border: 0; /*取消边框*/     width: 200px;     height: 40px;     background-color: white; /*背景可以改为一张图片*/     color: rgba(132, 133, 144, 0.8);     font-size: 20px;     -webkit-appearance: none; /*取消小三角的显示*/     text-indent: 0.01px; /*仅仅为了美观*/     background-image: url(../45.jpg);  /*你要替换后的小三角链接*/     background-repeat: no-repeat; /*不解释，但是别忘了*/     background-position: 170px 10px; /*把小三角放到该放的地方*/     margin: 0 20px; } span.so{ /*******以下为按键，与下拉框无关*******/     display: inline-block;     width: 200px;     font-size: 20;     text-align: center;     line-height: 40px;     color: white;     background-color:#e45353;  }