select加下拉箭头

<div class="flex">
  <
label>城市</label>
  <div class="dealerbo">
  <
select><option value="110000">北京市</option></select>
  </
div>
</
div>

 CSS

.flex {
 width: 30%;
 color: #2D3E4E;
 font-size: 15px;
 border-bottom: 1px solid rgba(45, 62, 78, 0.3);
 margin-right: 5%;
}
label {
 text-align: left;
 width: 100%;
 display: inline-block;
 margin-bottom: 5%;
 font-weight: 600;
 font-size: 15px;
}
.dealerbo {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    position: relative;
    width: 99%;
    align-items: center;
    justify-content: space-between;
    background: url(../images/arrow_Down.png) no-repeat 100% center;
    overflow: hidden;
    padding-right: 5%;
    white-space: nowrap;
}
select {
    height: 27px;
    font-size: 14px;
    color: #000;
    border: none;
    background-color: transparent;
    padding-bottom: 5px;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    text-overflow: ellipsis;
}

<div class="city">
    <div>
        <select>
           <option value="110000">北京市</option>
       </select>
   </div>
   <div>
        <select>
           <option value="110000">北京市</option>
       </select>
    </div>
</div>
.flex {
     position: relative;
     display: flex;
     flex-wrap: wrap;
     width: 100%;
     margin-bottom: 0.1rem;
     border-bottom: 1px solid rgba(45, 62, 78, 0.3);
}
.flex label {
 text-align: left;
 width: 100%;
 display: inline-block;
 margin-bottom: 2%;
 font-weight: 600;
}
.city {
    position: relative;
    display: flex;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    width: 100%;
}
.city::before {
    content: '';
    border-right: 1px solid #ddd;
    height: 20px;
    width: 1px;
    position: absolute;
    left: 47%;
    bottom: 9%;
}
.city > div {
    position: relative;
    width: 40%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 10%;
}
.popBox .pb .form .flex .city > div::after {
 content: '';
 height: 0.11rem;
 width: 0.22rem;
 position: absolute;
 background: url(../../pc/images/arrow_Down.png) no-repeat 100% center;
 right: 0;
 background-size: 100%;
 bottom: 0.2rem;
}


select {
    height: 27px;
    font-size: 0.28rem;
    color: #000;
    border: none;
    background-color: transparent;
    padding-bottom: 5px;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    text-overflow: ellipsis;
}
a, button, input, optgroup, select, textarea {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
button, optgroup, select, textarea {
    -webkit-appearance: none;
    outline: none;
    border-radius: 0;
}
select option {
    color: #000;
    font-size: 0.28rem;
}
原文地址:https://www.cnblogs.com/liubingyjui/p/13231329.html