Vue Element-ui中el-tabs，el-tab-pane切换改变字体颜色，自定义颜色等

HuiRonmantic

已于 2024-12-02 14:05:29 修改

阅读量1.6w

点赞数 7

分类专栏： Vue技术栈前端88 文章标签： vue.js ui 前端

于 2021-06-09 17:35:44 首次发布

本文链接：https://blog.csdn.net/weixin_41346436/article/details/117749810

版权

Vue技术栈同时被 2 个专栏收录

66 篇文章 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

前端88

14 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何在Vue Element-ui的el-tabs组件中，实现切换时字体颜色变化以及自定义底部条状颜色的效果，提供了相关的样式代码结构。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Element-ui中el-tabs，el-tab-pane切换改变字体颜色，以及自定义下方条状的颜色等

样式效果
在这里插入图片描述
代码结构

<template>
  <div class="main">
    <el-tabs v-model="activeName" class="box">
      <el-tab-pane label="视频" name="video">
        <CourseVideo></CourseVideo>
      </el-tab-pane>
      <el-tab-pane label="课件" name="courseWare">
        <CourseWare></CourseWare>
      </el-tab-pane>
      <el-tab-pane label="试卷" name="testPaper&

了解本专栏