как изменить цвет фона ngb-нумерации

Question

Я пытаюсь установить цвет фона для элемента ngb-pagination для angular2, но это не работает.

<ngb-pagination style="background-color:gray;" [collectionSize]="120" [(page)]="page" [maxSize]="5" [boundaryLinks]="true">

Спасибо.

Answer 1

Я нашел решение, спасибо за помощь.В моем состоянии проблема решена так в моем файле CSS.Чтобы переписать материал для нумерации страниц, просто используйте ключевое слово /deep/.

/deep/ .pagination .page-item .page-link {
  border-radius: 0 !important;
}

/deep/ .pagination .page-link {
  border-top-style: none !important;
  border-bottom-style: none !important;
  background-color: #f6f6f6 !important;
  color: black !important;
}

Спасибо.

Answer 2

Для меня приведенный ниже пример работал как шарм.

ngb-pagination .page-item.active .page-link {
  background-color: #7460ee;
  border-color: #7460ee;
}

Answer 3

Нет, если эта библиотека предоставляет способ настройки темы, если это будет наилучшим способом.

Но если вы хотите переопределить некоторые из внутренних стилей компонента, вы можете использовать ::ng-deep.

    ngb-pagination ::ng-deep ul > li:not(.active) > a {
          background-color: red !important;
    }

    ngb-pagination ::ng-deep ul > li.active > a {
          background-color: lightgreen !important;
    }

Также style="background-color:gray;" определенно не будет работать, вы можете увидеть DOM и его стиль