vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > vue3 elementPlus组件样式

vue3 elementPlus部分组件样式修改的方法

作者:小沐°

这篇文章主要介绍了vue3 elementPlus部分组件样式修改的方法,本文给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧

前提:在less语言下使用/deep/;在sass语言下使用 ::v-deep 替换 /deep/

 el-dropdown

//下拉框中文字颜色
::v-deep .el-dropdown-menu__item:not(.is-disabled):focus {
  background-color: #f5f5f5;
  color: #A88D5B;
}
//去除下拉框边框
:deep(.el-tooltip__trigger:focus-visible) {
  outline: unset;
}

el-input

//改变输入框选中时边框颜色
.el-input {
  --el-input-focus-border-color: #88733c;
}

el-tabs

//标签页选中时文字颜色
::v-deep .el-tabs__item.is-active {
  color: #a88d5b !important;
}
//标签页鼠标悬浮时文字颜色
::v-deep .el-tabs__item:hover {
  color: #a88d5b !important; //悬浮
}

到此这篇关于vue3-elementPlus部分组件样式修改的文章就介绍到这了,更多相关vue3-elementPlus样式修改内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文