vue、deep 重新样式没有生效问题
背景:引用了一个组件vxe-table,使用less重新某个图标样式想要改变排序图标向上箭头的样式,于是重新右侧的css,但是没有效果/deep/ .vxe-icon--caret-bottom:before, .vxe-icon--caret-left:before, .vxe-icon--caret-right:before, .vxe-icon--caret-top:before {bord
·
背景:
引用了一个组件vxe-table,使用less重新某个图标样式
想要改变排序图标向上箭头的样式,于是重新右侧的css,但是没有效果
/deep/ .vxe-icon--caret-bottom:before, .vxe-icon--caret-left:before, .vxe-icon--caret-right:before, .vxe-icon--caret-top:before {
border-width: 5px !important;
}
后来发现竟然是因为这样写/deep/ 并排css只有第一个生效
方法一:分开写
/deep/ .vxe-icon--caret-bottom:before{
border-width: 5px !important;
}
/deep/ .vxe-icon--caret-top:before{
border-width: 5px !important;
}
方法二:每个写deep
/deep/ .vxe-icon--caret-bottom:before, /deep/ .vxe-icon--caret-left:before, /deep/ .vxe-icon--caret-right:before, /deep/ .vxe-icon--caret-top:before {
border-width: 5px !important;
}
更多推荐
已为社区贡献3条内容
所有评论(0)