Primefaces组件CSS定制 [英] Primefaces components CSS customization
问题描述
正如我在质朴文档中所见,
As I see in the primefaces documentation,
1) To change the font-size of PrimeFaces components globally, use the `.ui-widget` style class.
An example with 12px font size.
.ui-widget,
.ui-widget .ui-widget {
font-size: 12px !important;
}
我对此有2个问题:
-
为什么在上面的代码中将
.ui-widget
写成三次?
对于tabView
的两个不同实例,我想以不同的方式自定义其标头的背景颜色,但是我找不到找到这种方法的方法.甚至有可能吗?
For two different instances of tabView
I want to customize its header background-color differently, but I couldnt find a way to do that. Is that even possible ?
推荐答案
在样式声明中,它们用逗号分隔了不同类替代的列表.具体来说,这条CSS状态:
In the style declaration they are comma delimiting the list of different class overrides. Specifically this piece of css states:
具有类ui-widget
的元素的ui-widget
子元素.
Classes ui-widget
and ui-widget
child elements of an element that has the class ui-widget
.
就标题背景而言,您可能不希望使用简单的CSS来修改背景颜色,因为我相信可能会重复使用各种不同的1px宽的GIF或JPG图像,而不是连续的连续声明的颜色.
As far as the header background is considered you might not have luck using simple CSS to modify the background color as I believe that it is likely using various different 1px wide GIF or JPG images repeated as opposed to a solid contiguously declared color.
如果要使用自己的样式表自定义Primefaces组件的默认主题,则最好查看Firebug之类的工具,
If you want to customize the default themes of the Primefaces components with your own stylesheets then you are best to look into a tool like Firebug, https://addons.mozilla.org/en-US/firefox/addon/firebug/ for inspecting classes, styles and modifying them real time on ANY web page that Firefox is currently viewing. It even has built in Javascript debugging.
这篇关于Primefaces组件CSS定制的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!