css - 更改内部类样式以溢出 : visible for specific class (For PrimeNG)

Question

此问题特定于 PrimeNG 或 angular2 组件。他们的样式是隐藏的，但在他们提到的文档页面上，虽然很模糊。这是网址:http://www.primefaces.org/primeng/#/dialog

如何改变组件的样式？

例如，对于 Dialog 组件，我们有 style 和 styleClass:

style       string  null    Inline style of the component.
styleClass  string  null    Style class of the component.

我们还有一个类 ui-dialog-content Content element .

现在我想将 ui-dialog-content 溢出样式更改为可见。我该怎么办？

这在文档中还不清楚。

我试过创建一个类

.dialog-overflow{
  overflow: visible;
}

并设置<p-dialog styleClass="dialog-overflow" ...但这显然不起作用，因为它不是正确的类 (ui-dialog-content)。

更新:我也尝试过此选项但没有成功:

.dialog-overflow .ui-dialog-content {
  overflow: visible;
}    

还有这个:

.dialog-overflow >>> .ui-dialog-content {
  overflow: visible;
}    

Answer 1

您可以使用已有的类:

.ui-dialog-content {
    overflow: visible;
}

---

但我相信你在这里犯了一个错误。该类不是使用 styleClass="abc" 设置的，而是使用 class="abc" 设置的。但我不太精通 Angular，所以我的知识基于 HTML。

因此您应该执行以下操作:

<p-dialog class="dialog-overflow"></p-dialog>

并使用您之前提供的 CSS:

.dialog-overflow{
    overflow: visible;
}