利用CSS进行表单样式定义

张军勇

我们在表单使用过程中，常常需要控制表单样式，如表单控件长度，显示样式，提醒背景色，甚至整个表单的字体和统一样式等。




这些其实都可以通过CSS来实现，使我们的表单看起来更漂亮，
1、利用DIV控制输入控件长度：
    如上图，表单姓名和出生日期字段看起来长短不一，并且太长，不美观，我们可以通过DIV的CSS样式进行调整。



上面的样式，我们可以通过在字段上加入DIV标签，并且设置DIV的样式，如长度150px，显示方式为同一行显示display: inline;


这样就实现了控件统一长度的效果；

2、控制字段标题文本统一长度及右对齐：
上图中，实际上，标题文本长度不一样，导致了控件不对齐，如果要向右对齐标题，并且让标题统一长度，我们也可以通过如上方式来实现：



3、更多变的样式设置：
下图中，我们首先设置了个整体的DIV，用来控制整体字体颜色和字体，然后，设置了控件样式和控件前面的标题样式，具体设置如下图：


显示效果如图：



总结：
   利用DIV和CSS可以设置很多显示效果，我在这儿只是抛砖引玉，希望大家利用CSS设计出更多的漂亮界面。
DIV样式网上有很多参考资料，如：
http://www.cnblogs.com/chuncn/archive/2008/09/28/1301647.html

张军勇

快速开发平台表单工作流优势在于表单可以自定义样式，可以通过HTML和CSS定义自己想要的格式。

王爱东

我看有二次开发用户做的用文档显示部件或文档编辑部件实现的增删改查，做得很漂亮。就跟网站一样呢。

万望

王爱东 发表于 2015-11-17 16:41
我看有二次开发用户做的用文档显示部件或文档编辑部件实现的增删改查，做得很漂亮。就跟网站一样呢。

截图来看看