css - 如何在elementUI中编辑el-breadcrumb的样式

Question

我正在尝试设置el-breadcrumb-item的字体大小，我通过chrome的调试器工具查看了这个标签的样式；我找到

显示el-breadcrumb-item的font-size继承自el-breadcrumb，所以我尝试设置的font-size el-breadcrumb 和类似的代码

<template>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="{ path: '/' }">HOME</el-breadcrumb-item>
    <el-breadcrumb-item>rankingList</el-breadcrumb-item>
  </el-breadcrumb>
</template>


<style scoped>
  .el-breadcrumb {
    font-size: 5em;
  }
</style>

但是它失败了，el-breadcrumb-item 的字体大小根本没有改变看起来像那样

Answer 1

您应该在 element-ui 默认 .css 文件中更改它。它的优先级高于您的 css，因此它涵盖了您的更改。