Question

版本：

Apache MyFaces 2.1.14 Rich Faces 4.3.5

问题：

我们正在从JSF1.2迁移到JSF2。问题是headerClass的样式未正确应用于rich：dataTable。调试时，富表面似乎会使用自己的样式覆盖headerClass样式。富面的syle选择器.rf-dt-hdr-c会覆盖自定义样式表选择器。（我们希望用自定义标题图像替换标题的颜色）

最后，当丰富的面孔提供样式(.rf-dt-hdr-c)被覆盖时，如下面的代码所示，它可以工作。但由于它是内置风格的丰富面孔，它将应用于每个rich：dataTable，这可能不是一个好选择。显示的here类似的approch在这里不起作用，因为没有规定将自定义样式与内置样式相结合。有没有更好的方法可以解决这个问题？是否有任何方式可以与.rf-dt-hdr-c一起应用自定义样式，以便它不会全局影响？请帮忙。

代码：

富数据表格摘要：

 <rich:dataTable id="admin" headerClass="richTableHeader1" styleClass="richDataTable1" rowClasses="evenRow,oddRow" 
                    columnClasses="columnRow" value="#{bean.list}" var="val">

样式：

.richDataTable1{    
    width:100%; 
}

<!-- this is the headerClass style used to apply custom image (not working )-->
.richTableHeader1{

    background-image:url(../images/heading1.gif) !important;
    background-color: #FFFFFF !important;
}

<!-- rich faces applied style overriden (working )-->
.rf-dt-hdr-c{
    background-image:url(../images/heading1.gif) !important;
    background-color: #FFFFFF !important;

}

Answer 1

这是一个表头：

<thead id="form:j_idt10:th" class="rf-dt-thd">
    <tr id="form:j_idt10:h" class="rf-dt-hdr">
        <th class="rf-dt-hdr-c" colspan="2" scope="colgroup">Table</th>
    </tr>
</thead>

@headerClass已应用于tr.rf-dt-hdr元素。所以你必须将你的定义改为

.richTableHeader1 th {
    background-image:url(../images/heading1.gif) !important;
    background-color: #FFFFFF !important;
}

或者你可以使用@headerCellClass，它不是一个记录的功能，但它可以工作。

Rich Faces dataTable StyleClass问题

1 个答案: