Angular 样式 css 不会被使用 'ngx-pagination' 的默认样式覆盖
Angular style css not overwritten by default style using 'ngx-pagination'
我目前正在使用 Michael Bromley 的 'ngx-pagination' 模块。该模块工作正常,但它似乎是唯一不使用现有主题的分页模块 css。现在看起来像:
阅读他的 explanation,似乎通过添加 /deep/
来覆盖 css 应该很容易。好吧,它不起作用...有人说它是'deprecated',所以我尝试添加!important
],但这似乎并不奏效。
见 -> https://stackblitz.com/edit/angular-p3swdg
在 'app.component.css' 我上传了主题 css 最后它应该是这样的(见 documentation):
如有任何帮助,我们将不胜感激。
这是快速工作stackblitz solution。
.pagination /deep/ .ngx-pagination .current {
background: red;
}
.pagination /deep/ .ngx-pagination li {
border: 1px solid #CCCC;
margin-right: 0px;
}
.pagination /deep/ .ngx-pagination a::after{
display: none;
}
.pagination /deep/ .ngx-pagination li::before{
display: none;
}
.pagination /deep/ .ngx-pagination li::after{
display: none;
}
.pagination /deep/ .ngx-pagination a::before{
display: none;
}
使用/deep
。您可以更好地修饰 css,但您会从中得到灵感。
我目前正在使用 Michael Bromley 的 'ngx-pagination' 模块。该模块工作正常,但它似乎是唯一不使用现有主题的分页模块 css。现在看起来像:
阅读他的 explanation,似乎通过添加 /deep/
来覆盖 css 应该很容易。好吧,它不起作用...有人说它是'deprecated',所以我尝试添加!important
],但这似乎并不奏效。
见 -> https://stackblitz.com/edit/angular-p3swdg
在 'app.component.css' 我上传了主题 css 最后它应该是这样的(见 documentation):
如有任何帮助,我们将不胜感激。
这是快速工作stackblitz solution。
.pagination /deep/ .ngx-pagination .current {
background: red;
}
.pagination /deep/ .ngx-pagination li {
border: 1px solid #CCCC;
margin-right: 0px;
}
.pagination /deep/ .ngx-pagination a::after{
display: none;
}
.pagination /deep/ .ngx-pagination li::before{
display: none;
}
.pagination /deep/ .ngx-pagination li::after{
display: none;
}
.pagination /deep/ .ngx-pagination a::before{
display: none;
}
使用/deep
。您可以更好地修饰 css,但您会从中得到灵感。