UI组件样式修改（Ele、iview等）

1.技术点：CSS，VUE等

步骤：

1.通过浏览器调试一下看你需要修改的样式在哪一个具体的属性上面

2.找到了当前属性—————属性名修改就行 和css一样

注意如果修改了 没有效果 使用::v-deep深度修改

例子1：iviewUI修改样式为例--改动边框颜色背景颜色字体颜色等

修改样式：下

<style>
.login-con .ivu-input {
    height: 40px;
    /* 增加的属性*/
    background-color: #0a4183;
    border: 1px solid #1b63a6;
    border-radius: 0px;
    color: #fff;
}
</style>

修改前：

修改后：

例子2：有时候需要::v-deep才能修改

<style>
/*通过v-deep才能修改*/
::v-deep.el-input__inner {
     height: 100%;
     background-color: #5b8ff9;
     border-radius: 0.3125rem;
     border: 0.0125rem solid #055fed;
}
</style>

标签：color,deep,Ele,修改,UI,属性,border,样式,iview
来源： https://blog.csdn.net/sky8880/article/details/121755510