如何在PrimeFaces中制作蒙皮标题栏

Question

在PrimeFaces展示页面上有一个简单的标题栏，适合实际的主题。 我的意思是本页的“欢迎来到PrimeFaces展示”文本： http ： //www.primefaces.org/showcase/ui/home.jsf

这不是一个按钮，也不是任何响应控件，只是一个主题文本框或标题栏。

我搜索了很多，但我找不到一个简单的<p：>组件，它可以生成这种结果。

任何人都可以帮助我，如何在PrimeFaces中制作这样的元素？

Answer 1

在这里，您可以找到欢迎页面的xhtml代码 - home.xhtml(home.jsf) ： http ： //code.google.com/p/primefaces/source/browse/examples/trunk/showcase/src/main/webapp /ui/home.xhtml?r=5567

正如你在那里看到的那样，'标题栏'只是一个带有一些css的简单<h1>标签：

<h1 class="title ui-widget-header ui-corner-all">Welcome to PrimeFaces ShowCase</h1>

在那里你可以找到整个primefaces网站/项目，以及CSS文件，但最好是实现你的CSS ...

Answer 2

您可以使用<p:toolbar>标记。 虽然它的主要用途在于将几个内容组合在一起，但它确实提供了您正在寻找的标题栏的效果。

<p:toolbar>
   <p:toolbarGroup align="left">
       <p:outputLabel value="Welcome!!" />
   </p:toolbarGroup>
</p:toolbar>

你可以用<h1> ， <p>等其他标签将<p:outputLabel>标签包围起来，以提高效果。