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

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">
        <testPaper></testPaper>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<style>
  /*导航条下方边框*/
   .main /deep/ .el-tabs__nav-scroll{