css下拉框的默认下拉

CSS下拉框是一种非常常见的Web组件，可以让用户从预定义的选项中选择一个值。默认情况下，浏览器会呈现下拉框的标准UI，包括箭头和背景颜色，而且这些UI通常会因浏览器而异。但是，我们可以使用CSS对下拉框进行自定义。

select {
  background-color: white;
  border: 1px solid gray;
  color: black;
  font-size: inherit;
  padding: 5px;
}

option {
  color: black;
}

select:focus,
option:hover {
  background-color: gray;
  color: white;
} 

上述代码是一个简单的CSS样式表，它可以对下拉框进行样式设置。基本上，我们重置了默认样式并添加了自己的样式。例如，我们使背景颜色为白色和边框为灰色，字体颜色为黑色，并设置选项的颜色也为黑色。我们还添加了一个:hover效果（当鼠标滑过选项时，显示为灰色背景和白色文本），这样可以帮助用户知道哪个选项正在被选择。

总之，CSS下拉框是一个简单但功能强大的Web组件。通过使用CSS，我们可以自定义下拉框的外观，使它更符合我们的设计需求。