ADF(UI)--别忘了<af:table>中<af:column>中的headerClass属性

在实际项目中,发现团队有人在使用<af:table>时,为控制一个表格每一列的头部的位置理左边边框有一定距离,如20px,发现其实现使用了<f:facet name="header">的方式包含一个<af:outputText>,然后对这个<af:outputText>设置inlineStyle="padding-left:20px;"  如下图:

无用质疑,这样做法是可行的。但实际上实现这个有更好的方式。

一种方法是修改全局的皮肤的CSS文件,对<af:column>的header样式做设置,这样会影响所有的table的表头,这样的做法显然不是我们想要的。

第二种方法和第一种类型,在全局的皮肤CSS文件添加对<af:column>的header含父子关系的CSS样式,然后再具体需要修改的<af:column>设置styleClass,这种方法估计我同事也清楚,但感觉为一个局部小功能需求修改CSS文件不划算,因此没有这样做,而采取了上述添加<f:facet name="header">的做法。

事实上,针对这个功能,<af:column>有一headerClass属性可以轻松实现该功能,如下图:

为什么说在这里使用headerClass比使用<f:facet name="header">的方式好呢,很简单,这样使用UI就减少了,服务器渲染的时间变少了,而且生成的html内容还变少了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值