ps怎么做网站首页界面,河北建设厅网站修改密码在哪里,网站没有关键词,网络营销的网站建设目录 默认样式
修改默认字体颜色#xff1a;
修改鼠标悬浮/选中字体颜色#xff1a;
去掉长分割线并修改下划线颜色
完整代码 默认样式 注意事项#xff1a;一定要在 style scoped不然修改的样式不会覆盖生效 修改默认字体颜色#xff1a; ::v-deep .el-tabs__…目录 默认样式
修改默认字体颜色
修改鼠标悬浮/选中字体颜色
去掉长分割线并修改下划线颜色
完整代码 默认样式 注意事项一定要在 style scoped不然修改的样式不会覆盖生效 修改默认字体颜色 ::v-deep .el-tabs__item {color:green;opacity: 0.5;
} 修改鼠标悬浮/选中字体颜色 ::v-deep .el-tabs__item.is-active {color: red;//选中opacity: 1;
}::v-deep .el-tabs__item:hover {color: red;//悬浮cursor: pointer;opacity: 1;
} 去掉长分割线并修改下划线颜色 /*去下划线 */
::v-deep .el-tabs__nav-wrap::after {position: static !important;
}/* 下划线颜色 */
::v-deep .el-tabs__active-bar {background-color: red;
} 完整代码
templateel-tabs v-modelactiveName tab-clickhandleClickel-tab-pane labelUser namefirstUser/el-tab-paneel-tab-pane labelConfig namesecondConfig/el-tab-paneel-tab-pane labelRole namethirdRole/el-tab-paneel-tab-pane labelTask namefourthTask/el-tab-pane/el-tabs
/template
script langts setup
import { ref } from vue
import type { TabsPaneContext } from element-plus
import { ElTabs, ElTabPane } from element-plus;const activeName ref(first)const handleClick (tab: TabsPaneContext, event: Event) {console.log(tab, event)
}
/script
style scoped
.demo-tabs.el-tabs__content {padding: 32px;color: #6b778c;font-size: 32px;font-weight: 600;
}::v-deep .el-tabs__item {color: green;opacity: 0.5;
}/**选中 */
::v-deep .el-tabs__item.is-active {color: red;opacity: 1;
}/**悬浮 */
::v-deep .el-tabs__item:hover {color: red;cursor: pointer;opacity: 1;
}/*去下划线 */
::v-deep .el-tabs__nav-wrap::after {position: static !important;
}/* 下划线颜色 */
::v-deep .el-tabs__active-bar {background-color: red;
}
/style