element ui 怎么添加选中的高亮呢？

Question

我改了源码样式，但是怎么更改选中的样式呢，还是必须得使用js呢？因为我们想二次开发element，然后改成自己的规范，我感觉用js不行，那我该怎么实现这个例子？

<el-breadcrumb separator="/">
  <el-breadcrumb-item to="/zh-CN/component/breadcrumb">首页</el-breadcrumb-item>
  <el-breadcrumb-item><a href="/">活动管理</a></el-breadcrumb-item>
  <el-breadcrumb-item to="/2">活动列表</el-breadcrumb-item>
  <el-breadcrumb-item to="/3">活动详情</el-breadcrumb-item>
</el-breadcrumb>

Answer 1

覆盖默认的css样式，你打开开发者工具，看下这个选中样式是写在什么class里面，你直接覆盖就可以了

Answer 2

像这种一般是用伪类实现的，如果只是小范围修改，直接覆盖掉即可。

.el-breadcrumb__inner:hover, .el-breadcrumb__inner a:hover {
    color: #409eff;
    cursor: pointer;
}

二次开发建议使用自定义主题工具去定制，不要直接覆盖样式，不然后期维护就是个灾难

https://github.com/ElementUI/...

Answer 3

添加标签的 hover 属性就可以了

Answer 4

/deep/覆盖原来的