Question

我在jsf中为网页设计导航栏。

我想要一些链接位于栏的右侧，一些位于左侧。它似乎没有用。

有什么想法吗？

<h:panelGrid columnus="2">
<h:panelGroup styleClass="alignmentLeft">
    <h:panelGrid columns = "2" columnsClasses = "alignmentLeft">
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
        <h:outputLink>... </h:outputLink>
        <h:outputText/>
    </h:panelGrid>
</h:panelGroup>
<h:panelGroup styleClass="alignmentRight">
    <h:panelGrid columns = "2" columnsClasses = "alignmentRight">
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
    </h:panelGrid>
</h:panelGroup>
</h:panelGrid>


.alignmentRight {
 text-align : right;
}

Answer 1

试试这个，你的编码中也有输入错误，它是你输入“columnus”的第一个h：panelGrid列

在<h:head>内，必须声明样式表。

<h:head>
<h:outputStylesheet name="styles.css"
        library="css" />
</h:head>

然后在<h:body>

<h:body> 
<h:panelGrid columns="2" width="600">
        <h:panelGroup>
            <h:panelGrid columns="2" columnClasses="alignmentLeft" width="200">
                <h:outputLink>...1 </h:outputLink>
                <h:outputLink>...2 </h:outputLink>
            </h:panelGrid>
        </h:panelGroup>
        <h:panelGroup>
            <h:panelGrid columns="2" columnClasses="alignmentRight" width="200">
                <h:outputLink>...3 </h:outputLink>
                <h:outputLink>...4 </h:outputLink>
            </h:panelGrid>
        </h:panelGroup>
    </h:panelGrid>
</h:body>

在样式表（styles.css）中，样式为

.alignmentLeft {
 text-align : left;
 border: 1px solid black;
 background-color: orange;
}
.alignmentRight {
 text-align : right;
 border: 1px solid black;
 background-color: lime;
}

如何正确对齐h：panelGrid？

1 个答案: