css - 如何使用 p :panelGrid 在特定单元格中设置 styleClass

Question

我有这样的布局:

column1(border-left-only), column2(noborder), column3(noborder), column4(border-right-only)

然后我这样设置column4:

<p:column style="border-style: solid !important;
    border-left: none !important;
    border-bottom: none !important;
    border-top: none !important;
    border-right-color: #dddddd !important;">

为什么当我创建以下 CSS 类并设置 p:column 时，该类不起作用？

    .panelgridInicialLogado-column4{
        border-style: solid !important;
        border-left: none !important;
        border-bottom: none !important;
        border-top: none !important;
        border-right-color: #dddddd !important;
    }


<p:column styleClass="panelgridInicialLogado-column4">

Answer 1

试试这个

我的风格

<style>
    .panelgridInicialLogado-column1{
        border-style: solid !important;
        border-bottom: none !important;
        border-top: none !important;
        border-right: none !important;
        border-left-color: red !important;
    }
    .panelgridInicialLogado-column2{
        border-left: none !important;
        border-bottom: none !important;
        border-top: none !important;
        border-right: none !important;
    }
    .panelgridInicialLogado-column3{
        border-left: none !important;
        border-bottom: none !important;
        border-top: none !important;
        border-right: none !important;
    }
    .panelgridInicialLogado-column4{
        border-style: solid !important;
        border-left: none !important;
        border-bottom: none !important;
        border-top: none !important;
        border-right-color: red !important;
    }
</style>

在面板网格中

<p:row>
    <p:column styleClass="panelgridInicialLogado-column1">Conf. Semifinals</p:column>
    <p:column styleClass="panelgridInicialLogado-column2">Conf. Finals</p:column>
    <p:column styleClass="panelgridInicialLogado-column3">NBA Finals</p:column>
    <p:column styleClass="panelgridInicialLogado-column4">Champion</p:column>
</p:row>