项目中常常要修改框架自带的样式,可是写style,却没有效果vue
方法一:给组件加id / class,在style一面直接修改,注意style不要加scoped,vue能够有多个style
结构:ios
选择日期:
至
添加
{{item.time}}
样式:web
#noAssessmentDate .ivu-modal {
width: 686px !important;
}
#noAssessmentDate .ivu-tag {
width: 105px;//修改tag的宽度
}
#noAssessmentDate .ivu-icon-ios-close-empty:before {
color: red; //红x
}
效果:
方法二:
利用深度/deep/深度修改组建的样式,能够直接写在到scoped做用域的style里面。(推荐)
结构:app
样式:框架
#tab_keyTag /deep/ .ivu-table .ivu-table-header .ivu-checkbox {
display: none;
cursor: none;
}
#tab_keyTag /deep/ .ivu-table .ivu-table-header label:after {
content: "选择";
}
#tab_keyTag /deep/ .ivu-table .ivu-table-header .ivu-checkbox-wrapper {
cursor: default;
pointer-events: none;
}
关于/deep/,一张图看懂:
看效果:
svg