[图]完全用CSS写出来的表单布局和仿table表格布局

为了应付项目的需要,写了两个类来做表单和表格的设计。

e69caae591bde5908d-11

这个表格用到了几个层的嵌套来实现了cell-padding的效果和边框的效果。采用float left的方式进行定义,完全可以像操作表格一样操作它,快下班的时候加入了两种特性,一种是尾行的特殊功能,比如在选择控件时实现反选、反选等,还加入了odd双行的换色的显示。完全定义的web2.0表格,不用再用table了。当然位置一定要设置好。否则可能会有问题,目前测试ff下ie 6 下均正常。

e69caae591bde5908d-2

这个是用div+label+span来实现的一个表单框架,可以实现form,group,line到element的单独控制,行间换色显示和列间的换色显示,控制台的特殊设置和title及对提示的控制。更多的就不说了额。有空把代码整理了贴上来

Comments