Element-plus的el-input改边框focus后颜色

问题： 

我使用的vue3+element plus，使用了他的输入框；

问题是获取焦点之后，发现修改不了input框的蓝色边框，下图所示

解决办法： 

1.获取属性名字

F12（右键检查）选中input元素——复制2中的类名——

        右侧输入el-input——看到下方有蓝色的两个属性，双击复制名字。

 

2.修改样式

在你的<style >中添加下面样式即可。

.el-input__wrapper {
  --el-input-focus-border-color: yellow;
}

注意：因为Element Plus版本不同，类名可能不一样，有的可能是，主要看2的类名吧。

.el-input {
  --el-input-focus-border-color: yellow;
}

参考文章：Element-plus的el-input改边框focus后颜色_element input框 出发焦点改变边框颜色-CSDN博客