css - 如何更改primeng v11.2.0 p-calendar的高度和宽度？

Question

如何改变下面p-calendar的高度和宽度primeng version 11.2.0

https://primefaces.org/primeng/showcase/#/calendar

p-calendar我想在我的 Angular 应用程序上使用上述内容。

我在 CSS 下尝试过，但没有奏效。

.ui-calendar .ui-datepicker {
  height: 200px!important;
}

建议我这个。

Answer 1

您可以通过这些类减少日期单元格的单元格填充来按比例控制日期选择器的高度。

.p-datepicker table td{ //adjust the padding }
.p-datepicker table td > span { //adjust the width and height }

Answer 2

在这里再补充几点。在你的 style.scss 中使用这些样式，它与 index.html 平行，在很多地方也使用 !important。您还可以参考此链接了解更多课程，https://www.primefaces.org/primeng/showcase/#/calendar

.p-datepicker table td{ //adjust the padding }
.p-datepicker table td > span { //adjust the width and height }