css下拉框图标边框怎么隐藏

CSS下拉框是网页设计中常用的工具，可以美化页面同时也可以方便用户选择内容。不过，下拉框的图标边框可能会影响页面的整体美观，所以我们可以通过CSS的代码来隐藏这个边框。

/* 隐藏下拉框图标边框 */
select {
  appearance: none; /* 兼容性写法 */
  -moz-appearance: none; /* Firefox */
  -webkit-appearance: none; /* Chrome, Safari, Opera */
  border: none;
  outline: none;
  background: transparent;
  padding-right: 20px; /* 图标占位 */
  background-image: url("icon.png"); /* 图标背景 */
  background-repeat: no-repeat;
  background-position: right center;
} 

上述代码中，我们通过设置CSS的appearance属性为none来隐藏图标的默认样式。同时，利用background属性来设置图标的背景图片，通过padding属性来设置图标占位，最后通过background-position属性来设置图标的位置。

这样设置之后，我们发现下拉框的图标边框消失了，页面的美观程度得到了提升。