自定义tabView标头的外观 [英] Customizing the look of tabView headers

问题描述

我期待自定义tabView组件的外观.我需要更改标签页眉的颜色(如果可能的话，请为2个不同的页眉更改2种不同的颜色).我试图通过为tabView的styleClass属性指定CSS规则来做到这一点，但未能看到所需的结果.

I am looking forward to customize the look of tabView component. I need to change the color of tab headers(& if possible, 2 different colors for 2 different headers). I tried to do so by specifying the CSS rules through styleClass attribute for tabView but failed to see desired results.

我如何实现这一目标?

推荐答案

Primefaces组件从css主题获得外观.您可以:

Primefaces components get the look&feel from a css theme. You can either:

• 使用 Themeroller

手动更改主题的样式类. Primefaces文档中列出了每个Primefaces组件的样式类.由于该文档对于最新的Primefaces版本2.2并非免费，因此我只能为您提供Primefaces 2.1中的类:.ui-tabs，.ui-tabs-nav，.ui-tabs-panel.请注意，可能有更多样式类应用于从其他组件继承的选项卡视图.检查tabView的html源以获取所有应用类.

Change the style classes for your theme manually. Style classes for each Primefaces component are listed in the Primefaces documentation. Since the doc is not free for most recent Primefaces version 2.2 I can only help your with the classes from Primefaces 2.1: .ui-tabs, .ui-tabs-nav, .ui-tabs-panel. Notice that there might be more style classes applying to the tab view inherited from other components. Check html source of the tabView to get all applying classes.

使用答案中所述的style或styleClasses属性，并使用

Use the style or styleClasses attribute as described in your answer and overwrite the theme classes with the !important declaration

这篇关于自定义tabView标头的外观的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！