如何在jsf2 primefaces中调整选项卡的宽度和高度? [英] how to adjust width and height of the tab in jsf2 primefaces?

问题描述

如何在jsf 2 Primefaces中调整选项卡的宽度和高度.还请告诉我如何控制标签内的文本(颜色和字体大小)?谢谢.

How to adjust the width and height of the tab in jsf 2 primefaces. Also please tel me how to control the text(color and font size) inside the tab? Thanks.

推荐答案

PrimeFaces使用ThemeRoller CSS框架.转到 jQuery UI ThemeRoller页面并创建您自己的主题.下载CSS文件，并将其包含在您的.xhtml页面中.

PrimeFaces uses the ThemeRoller CSS Framework. Go to the jQuery UI ThemeRoller page and create your own theme. Download the CSS file and include in your .xhtml pages.

<link type="text/css" rel="stylesheet" href="resources/css/skin.css" />

将其添加到您的web.xml中，以便不使用默认主题:

Add this to your web.xml so the default theme is not used:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>none</param-value>
</context-param>

创建新主题然后确定要覆盖的CSS规则以使选项卡看起来像您想要的方式要容易得多.

It is much easier to create a new theme then to figure which CSS rules to override to make the tabs look the way you want.

jQuery UI标签页上有一个关于主题的章节及其使用的CSS规则.

The jQuery UI tabs page has a section on Theming and the CSS rules it uses.

选项卡的宽度根据文本的长度而变化，高度取决于字体大小.

The tab width changes depending on the length of the text and the height is determined by the font-size.

要增加字体大小，请将以下CSS替换为类似的内容:

To increase font size override the following CSS to something like this:

.ui-tabs {
    font-size:1.3em;
} 

这篇关于如何在jsf2 primefaces中调整选项卡的宽度和高度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！