タブを作成し、richfaces:tabpanel
コンポーネントを使用する必要があります。
<td>
問題は、含まれているリッチフェイスによって作成されたエキストラでspacer.gif
あり、タブ間にスペースがあります。
を使ってみましたrichfaces:tabpanel property headerspacing="0px";
が、スペースが存在します。
私たちは使用richfaces version 3.3.3.Final
していますjsf version 1.2
jsp:
<td width="100%">
<rich:tabPanel headerSpacing="0px;">
<rich:tab id="tab1">
<f:facet name="label">
<h:outputText value="Tab1"></h:outputText>
</f:facet>
<ui:include src="./tab1.jspx"/>
</rich:tab>
<rich:tab id="tab2">
<f:facet name="label">
<h:outputText value="tab2"></h:outputText>
</f:facet>
<ui:include src="./tab2.jspx"/>
</rich:tab>
</rich:tabPanel>
</div>
</td>
CSS:
.rich-tabhdr-side-border {
border: none;
background-image: none;
}
.rich-tabhdr-side-cell{
border: 1px solid #ABAA96;
height:23px;
display:block;
background:url(../images/ButtonConatinerBG.gif) repeat-x top;
border-bottom:1px solid #A1A290;
font-size: 12px;
font-weight:bold;
color: #FFFFFF;
}
.rich-tabpanel-content {
font-family: verdana;
font-size: 12px;
color: #000000;
background-color:#F9F9FB;
}