Vue中使用Element UI 的面包屑组件,如何修改其字体的样式。

dick_binge
  • 125

如图所示:默认后边的是浅颜色的,前边的是深色的。

clipboard.png
现在想改为第一个是浅色的,第二个是深色的。

clipboard.png

目前代码部分这么写的:
<el-breadcrumb-item

v-for="(item,index) in breadList" :key="index"     
:class="index==0&&breadList.length>1?'el-bread-one':'el-bread-two'"
:to="{path:item.path}">{{item.name}}

</el-breadcrumb-item>
但是发现:样式是加在外层的span标签上的。没有效果。

clipboard.png

回复
阅读 10.5k
4 个回答
.el-breadcrumb__inner {
  color: 你期望的颜色
} 

覆盖掉就好了

.el-breadcrumb__item:last-child .el-breadcrumb__inner
.el-breadcrumb__item .el-breadcrumb__inner设置不同颜色color:redcolor:blue等;
然后如果不生效,注意样式权重即可;

/deep/ 或者 >>>

有可能是组件没有渲染先给了样式导致的,可以加个定时器看看

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏