更新时间:2022-08-14 20:46:48
<p:layout fullPage="true">
<h:form>
<p:layoutUnit position="west" size="100">
<h:outputText value="Left Pane" />
</p:layoutUnit>
<p:layoutUnit position="center">
<h:outputText value="Right Pane" />
</p:layoutUnit>
</h:form>
</p:layout>
布局使用到的皮肤样式类
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<h:head>
<f:facet name="first">
<meta http-equiv="X-UA-Compatible" content="EmulateIE8" />
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
<title>PrimeFaces Layout</title>
</f:facet>
<style type="text/css">
</style>
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="100" header="Top" resizable="true" closable="true" collapsible="true">
<h:outputText value="顶部区域" />
</p:layoutUnit>
<p:layoutUnit position="south" size="100" header="Bottom" resizable="true" closable="true" collapsible="true">
<h:outputText value="底部区域" />
</p:layoutUnit>
<p:layoutUnit position="west" size="300" header="左部" collapsible="true" footer="左底" gutter="1" effect="drop">
<p:accordionPanel>
<p:tab title="菜单1">
<h:outputText value="菜单1测试" />
</p:tab>
<p:tab title="菜单2">
<h:outputText value="菜单2测试" />
</p:tab>
<p:tab title="菜单3">
<h:outputText value="菜单3测试" />
</p:tab>
</p:accordionPanel>
</p:layoutUnit>
<p:layoutUnit position="center" closable="true" collapsible="true" header="Contents">
<h:form>
布局组件Layout是一个高度可定制的边框布局模型,它可以很轻松地创建复杂的网页布局,即使不懂Web设计。布局组件Layout是一个高度可定制的边框布局模型,它可以很轻松地创建复杂的网页布局,即使不懂Web设计。布局组件Layout是一个高度可定制的边框布局模型,它可以很轻松地创建复杂的网页布局,即使不懂Web设计。布局组件Layout是一个高度可定制的边框布局模型,它可以很轻松地创建复杂的网页布局,即使不懂Web设计。
</h:form>
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
</html>