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

【问题标题】：how to edit the style of the el-breadcrumb in elementUI如何在elementUI中编辑el-breadcrumb的样式
【发布时间】：2017-09-20 12:34:25
【问题描述】：

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

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

<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 的字体大小根本没有改变看起来像这样

【问题讨论】：

标签： css vue.js web-frontend

【解决方案1】：

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

【讨论】：

【解决方案2】：

取消作用域，您的样式会覆盖默认元素样式。

【讨论】：