改变element-ui的input组件的(以边框为例)样式

在vue项目中，不可避免的会用到element-ui这个组件库，也往往总需要改变一些组件的样式去和我们的项目相适应美观，很多组件都通过给一个class名再改变就可以了，！！！但是最近碰到需要改变Input输入框这个组件的边框颜色，找了n次的百度博客，都没有解决

1. 先统一说一下曾经n次找到的百度博客表达的解决方式，总体来说就是，给你想改变样式的input一个class类名，然后给它我们自己想要的样式，最好复杂点，重点的是，不能在<style scoped></style>里面写，写了也是无效的，要在<style></style>里面写，本小白表示，失败失败失败！
2. 那么如何解决的？
3. ！！解决：不需要再多写一个class类名，举个“不要input的border边框”的例子，只要加上以下代码就可以：

<style>
/* 三种方法选择自己喜欢的一个即可 */
/* .el-input--prefix .el-input__inner{
  border: none;
} */
/* .el-input--small .el-input__inner {
    border: none;
} */
.el-input__inner{
  border: none;
}
</style>

总结一下： 解决这种需要改变组件库里的组件的样式的方法就是：
1.首先打开我们浏览器的“检查元素”或快捷键F12，
2.“查看器”找到我们想要改变的组件点击，找到组件本身给我们的样式类名，
3.将它复制下来放到我们的<style></style>里面，这里注意 style不能加scoped，
4.最后在此类名中书写我们想要的样式即可。
附上图片： ps：如果并不确定是哪一个class类名起到你想要改变的那个样式，我们可以先在“查看器中”先改变，看是否起作用，然后再在我们的样式中添加；那么其实其它的元素想要改变样式也是这么一个理。