界面规范的其他框架实现-列表-JSF实现

平台的开发理念是统建平台然后搭应用。但在现实里，企业已经上线了很多系统，替换需要时间。使用最小的代价让异构系统也使用平台的界面规范，是其看起来是平台上的应用是个可行方案。修改界面风格最直接的方法是修改css文件，而且修改css文件并不影响应用本身。

         现在的项目就是这样做的。其中一个系统采用的JSF框架。实现方式如下：

         jsf标签如下<x:dataTable>

         定义  styleClass="table03"

.table03 {border-collapse: collapse;border: 2px solid #d0e0e0
}

headerClass="table_top"

td.table_top, th.table_top {
    border-collapse: collapse;
    text-align: center;
    font-family: 微软雅黑;
    font-size: var(--defaultTxtSize);
    background-color: #f2f2f2;
    padding: 2px;
    height: 40px;
    border: 1px solid #dfe6ec;
    color: #34b6a4;
    font-weight: 700;
}

斑马纹：

.table03 tbody tr:nth-child(even) {background-color: #f2f2f2;
}
.table03 tbody tr:nth-child(odd) {background-color: #ffffff;
}
行滑过：
.table03 tbody tr:hover{background-color: #8dccff
}