在日期选择器ngx-bootstrap中自定义样式

Question

我想在ngx-bootstrap的日期选择器中添加自定义样式（角度为4），因为我希望日期选择器的标题具有白色背景以及标题上出现的所有文本，如月份名称，箭头键，黑色的一年。

bs-datepicker.css中的默认样式不提供所需的样式。除了修改库文件之外，还有其他方法可以修改默认样式，因为它不是一个选项。

Answer 1

您可以在项目的样式表中覆盖标准样式，但是您需要使用更具体的选择器或!important。

body .bs-datepicker-container .bs-datepicker-head {
  background-color: #fff;
}
body .bs-datepicker-container .bs-datepicker-head * {
  color: #000;
}

示例 - https://stackblitz.com/edit/angular-z9cn3d?file=styles.css

Answer 2

更改颜色变量

.bs-datepicker-head,
.bs-datepicker-head, .bs-datepicker button:active,
.bs-datepicker-body table td span.selected, 
.bs-datepicker-body table td.selected span,
.bs-datepicker-body table td span[class*="select-"]:after,
.bs-datepicker-body table td[class*="select-"] span:after, 
.bs-datepicker-body table td.active-week span:hover 
{
background-color: $primary !important; 
}

.bs-datepicker-body table td.week span 
{
color: $primary !important; 
}