Question

我有用CSS设计的html页面。 DIV和SPAN元素有选择器，如下所示：

...

#gr-bg1 {
    ....
    background-color: red;
    ....
}

...

并使用panelGroups创建适当的xhtml页面：

 <h:panelGroup id="gr-bg1" styleClass="item1" layout="block">
        <h:panelGroup styleClass="item-value">
            <h:outputText value="#{i18n.rejections}"/>
        </h:panelGroup>
        <h:panelGroup styleClass="num" layout="block">
            <h:outputText value="#{info.rejections}"/>
        </h:panelGroup>
 </h:panelGroup>

结果有html：

<div id="A4405:gr-bg1" class="item1">
   <span class="item-value">text</span>
   <div class="num">34534535</div>
</div>

如果css选择器看＃gr-bg1 id该怎么办？

Answer 1

几个月前，JSF和CSS遇到了同样的问题。我想我解决了它通过Firebug读取html生成的tag的ID并替换了Id的{{1}}。

在你的情况下：

CSS-sheet

不知道这是否是最佳做法，但这是一种解决方法。

否则，您可以通过将元素放在您自己的Id之上并使用它来阻止JSF生成自己的ID，例如元素的“A4405”放置在div之上一层。

JSF + CSS：自定义panelGroup id由UINamingContainer覆盖

1 个答案: