select默认样式中的小三角不能删掉，要修改它的样式，只能使用图片将其隐藏掉。
示例：
<style>
.parent {
display: flex;
width: 100%;
min-height: 100vh;
align-items: center;
justify-content: center;
}
.select {
width: 200px;
height: 2rem;
border: 1px solid rgba(48, 43, 43, 0.3);
/*内容居中显示*/
text-align: center;
text-align-last: center;
/* 去掉select自带的样式 */
appearance: none;
/* IE */
-webkit-appearance: none;
/* google */
-moz-appearance: none;
/* firefox */
background: url("img/arrow_down.png") no-repeat scroll right center transparent;
background-size: 10% 30%;
/* 手势样式 */
cursor: pointer;
}
/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand {
display: none;
}
</style>
<body>
<div class="parent">
<label for="">浏览器选择：</label>
<select class="select" name="" id="" placeholder="请选择使用的浏览器">
<option value="1">百度</option>
<option value="2">谷歌</option>
<option value="3">火狐</option>
<option value="4">360浏览器</option>
<option value="5">UC浏览器</option>
</select>
</div>
</body>
推荐一个好用的图标下载网站：https://www.easyicon.net/
网友评论