2

JSF 2.0 で t:datalist を使用して、画像を水平方向に配置しています。しかし、各画像のプロパティを画像の下に垂直にリストしたいと思います。現在、プロパティも画像とともに水平にリストされています。私が使用するコードは次のとおりです。

    <t:dataList var="item" value="#{listItems.dataList}" id="listItems"> 
                        <h:graphicImage url="#{item.prodFileName}" width="100" height="100" />
                        <h:outputText value="#{item.prodName}" />
                        <h:outputText value="#{item.prodPrice}" />
            </t:dataList>

データリスト内でプレーンな html テーブル タグを使用して、画像の下に名前と価格のプロパティをリストすることができません。f:verbatim という名前のタグが検索の結果見つかりましたが、機能させることもできませんでした。panelGroup 内にも html table タグを入れてみました。

4

1 に答える 1

2

それらを左フローティングでラップし<div>、画像の下に線を<br>.

<t:dataList var="item" value="#{listItems.dataList}" id="listItems"> 
    <div class="box">
        <h:graphicImage url="#{item.prodFileName}" width="100" height="100" />
        <br /><h:outputText value="#{item.prodName}" />
        <br /><h:outputText value="#{item.prodPrice}" />
    </div>
</t:dataList>

たとえば、このCSSで

.box {
    float: left;
    margin: 5px;
    padding: 5px;
    border: 1px solid gray;
}

clear: left;フロートがコンテナーを超えないように、コンテナー要素に があることのみを確認してください。


問題とは関係ありませんが、JSF 2 では非推奨<f:verbatim>になっていることに注意してください。今後は使用しないでください。また、もう必要ありません。JSF 1.0/1.1 では、JSF ページでプレーンな HTML タグを使用できるようにするために、そのタグは必須でした。JSF 1.2 以降、必須ではなくなりました。をいじることなく、必要な場所にある JSF ページの HTML タグをインライン化することができます。<f:verbatim>

于 2011-09-20T11:37:10.487 に答える