el-select下拉框鼠标移入选项和移入下一个选项，上一个选项的样式

el-select下拉框选项的鼠标移入样式可以使用CSS来控制。你可以在样式表中添加以下CSS代码：

.el-select-dropdown .el-select-dropdown__item:hover {
  background-color: #f5f7fa;
}

这样就可以在鼠标移入选项时改变选项的背景色了。如果你希望在鼠标移入下一个选项时恢复前一个选项的样式，可以将上面的代码修改为：

.el-select-dropdown .el-select-dropdown__item:hover:not(.selected) {
  background-color: #f5f7fa;
}

.el-select-dropdown .el-select-dropdown__item.selected,
.el-select-dropdown .el-select-dropdown__item.hover {
  background-color: #f5f7fa;
}

这样就可以在鼠标移入选项时改变选项的背景色，并且在鼠标移入下一个选项时将前一个选项的背景色恢复为默认值。同时，已经选中的选项和当前鼠标所在的选项也会保持高亮样式。

相关问题

el-select下拉框鼠标离开的样式

el-select下拉框鼠标离开的样式可以通过CSS样式表来设置。

例如，你可以添加一个:hover的伪类选择器来设置鼠标悬浮在下拉框选项上时的样式，同时添加一个:focus的伪类选择器来设置选中某个选项时的样式。

示例CSS代码如下：

/* 悬浮在选项上的样式 */
.el-select-dropdown .el-select-dropdown__item:hover {
  background-color: #f5f5f5;
}

/* 选中某个选项的样式 */
.el-select-dropdown .el-select-dropdown__item:focus {
  background-color: #e6f7ff;
}

这里的.el-select-dropdown__item是el-select下拉框选项的class名称，你可以根据实际情况调整样式。同时，你也可以设置其他样式属性，如字体颜色、边框等。

el-select 下拉框显示时修改选项的样式

要修改 el-select 下拉框选项的样式，可以使用 scoped slot 的方式来自定义下拉框选项的渲染，这样就可以自由地修改选项的样式了。以下是一个示例：

<el-select v-model="selectedOption">
  <template slot="options" slot-scope="{ option }">
    <span :class="{ 'is-highlighted': option.value === selectedOption }">{{ option.label }}</span>
  </template>
  <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option>
</el-select>

在这个示例中，我们使用了 el-select 的 scoped slot `options` 来自定义下拉框选项的渲染。在模板中，我们使用了一个 span 元素来渲染选项，并根据选项是否被选中来添加一个 `is-highlighted` 的 class。然后在 CSS 中，我们可以定义这个 class 的样式：

.is-highlighted {
  background-color: yellow;
}

这样，当一个选项被选中时，它的背景色就会变成黄色。你可以根据自己的需要修改样式。