在做项目的时候需要tab切换,使用了elementui的el-tabs组件,但是出现了一个问题
- 正常点击tab进行切换时,tab标签样式是非常容易修改的
- 但是在使用键盘进行tab切换是,就出现了一条蓝框框
官网显示如下:
我的项目中显示如下
非常不好看
在浏览其进行审查时,发现被选择的tab有如下属性
于是在代码中添加一下代码,成功将它去掉
::v-deep .el-tabs__item:focus.is-active.is-focus:not(:active) {
-webkit-box-shadow: none;
box-shadow: none;
}
::v-deep :vue样式穿透,可自行百度。