Element Plus 部分样式修改

带着叉子的帆船

于 2024-08-29 16:30:42 发布

阅读量317

点赞数 3

文章标签： vue.js 前端 elementui

本文链接：https://blog.csdn.net/weixin_45384466/article/details/141682125

版权

1、输入框样式修改

/* 输入框背景色 */

:deep(.el-input--large .el-input__wrapper) {
    background: rgba(0, 0, 0, 0);
}
/* 输入框边框 */
:deep(.el-input) {
    --el-input-border-color: #409EFF;
    /*边框样式修改*/
    --el-input-hover-border-color: #409EFF;
    /*鼠标经过边框样式修改*/
}
/* 提示文字样式修改 placeholder  */

:deep(.el-input__inner::placeholder) {
    color: #9C9C9C !important;
}

el-tree样式修改

:deep(.el-tree-node__content:hover) {
    /* 鼠标经过背景色修改 */
    background-color: rgba(0, 0, 0, 0);
    /* 鼠标经过字体颜色 */
    color: #E6A23C;
}
:deep(.el-tree) {
    /* 整个树的背景色修改 */
    background: rgba(0, 0, 0, 0);
    /* 字体颜色 */
    color: #FFF;
    /* 点击树时 背景色修改 */
    --el-tree-node-hover-bg-color: rgba(0, 0, 0, 0);
}
:deep(.el-checkbox__inner) {
    /* 树多选框背景色修改 */
    background-color: rgba(0, 0, 0, 0);
}