Primeng - how to use styleClass?

为君一笑 提交于 2019-12-06 17:17:56

问题


I want to use the styleClass property of the Togglebutton component. As described in another post, I thought it is straight forward by using:

styleClass="test"

In my css-file I then set some attributes, like

.test { background: red; }

But this does not work. Working with style is perfectly clear by using [style]="{'background':'red'}" No problem with that. But styleClass does not work. Here is the component. Any idea how to use styleClass?


回答1:


To make things clear: the styleClass property is only an addition to the original classes of the component. That means, you always have to use the original classes in order to style the component. With styleClass you then have the possibility to address one or more components of a set of components of the same type. So, having five Togglebutton components, you can generally style those components with

.ui-togglebutton.ui-button.ui-state-active{}

If you then want to style one of those components differently, you can add the styleClass property:

<p-toggleButton styleClass="different"></p-toggleButton>

And in your css you can now address this one by:

.different.ui-togglebutton.ui-button.ui-state-active{}

Thus styleClass is not a replacement for the original selectors, it is an addition.



来源:https://stackoverflow.com/questions/46350302/primeng-how-to-use-styleclass

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!