css中的select怎么改箭头的颜色

如果你指的是下拉框（select）中的箭头，可以使用以下 CSS 代码改变箭头的颜色：

select::-ms-expand {
    color: red; /* IE11 */
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(arrow.svg) no-repeat right center;
    color: black;
}

其中，`::ms-expand` 伪元素是用于在 IE11 中改变箭头颜色的，`-webkit-appearance`、`-moz-appearance` 和 `appearance` 是用于隐藏原生下拉框的样式，`background` 是用于添加自定义的箭头图标，`color` 是用于设置下拉框中的文本颜色。

相关问题

h5 中 修改select箭头样式

HTML5 中修改 select 箭头样式的方法和 HTML4.01 的方法基本相同，可以通过 CSS 来实现。

/* 隐藏默认的下拉箭头 */
select::-ms-expand,
select::-webkit-inner-spin-button,
select::-webkit-outer-spin-button {
  display: none;
}

/* 使用自定义的箭头图片 */
select {
  background-image: url("path/to/custom-arrow.png");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 16px 16px;
}

以上代码将默认的下拉箭头隐藏，并使用自定义的箭头图片。需要注意的是，不同浏览器的实现可能会有差异。

el-select 修改箭头样式

你可以使用 `::after` 伪元素来修改 `el-select` 组件的箭头样式。以下是一个示例代码，你可以将其放在你的CSS文件中：

.el-select__caret::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%) rotate(45deg);
  border-style: solid;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  width: 8px;
  height: 8px;
}

你可以根据需要修改 `right` 和 `transform` 属性来调整箭头的位置和方向。你也可以通过修改 `width` 和 `height` 属性来调整箭头的大小。