WEB界面开发规范.doc

《WEB界面开发规范.doc》由会员分享，可在线阅读，更多相关《WEB界面开发规范.doc（5页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、WEB界面开发规范页面设计规则页面命名规则1、每个功能页面在系统中配置菜单时统一使用index.jsp或index.html。例如客户管理配置的URL为http:/Server:Port/cc/custmgr/index.jsp。2、每个页面的title必须设置为和菜单配置中相同的中文，例如在菜单项中配置为“客户管理”，则此页面的title也要设置为“客户管理”。3、对于JSP页面都需要在页面的最开始部分增加以下语句4、对于HTML页面都需要在页面的最开始部分增加以下语句 5、对于页面中控件的属性设置都需要用双引号包括起来。控件命名规则页面编码过程中用到的所有控件命名都需要遵循相应规则，方便程

2、序的可读性。采用控件类型缩写前缀（小写）+英文单词（第一个字母大写）的方法来命名每一个控件。具体规则如下：控件类型前缀ButtonbtnFormfrmSelectselTextAreatxtInputiptImageimgDIVdiv变量定义规则页面编码过程中用到的所有变量定义都需要遵循相应规则，方便程序的可读性。采用数据类型缩写前缀（小写）+英文单词（第一个字母大写）的方法来命名每一个变量。具体规则如下：数据类型前缀整数i小数f字符s布尔b日期d数组arr函数定义规则页面编码过程中用到的所有函数定义都需要遵循相应规则，方便程序的可读性。采用前缀（fuc）+英文单词（第一个字母大写）的方法来命

3、名每一个函数。例如：fucAcceptOrderCSS文件使用n 页面的规范关键字说明body页面内容基本样式n 表格的规范关键字说明table表格的基本样式n 层的规范关键字说明div层的基本样式n 链接的规范关键字说明a超链接的基本样式n DataGrid的规范关键字说明table.datatable数据表的基本样式table.datatable thead数据表的页眉样式table.datatable tbody数据表的表格体样式table.datatable tfoot数据表的页脚样式table.datatable tr.row_odd数据表的奇数行样式table.datatable

4、tr.row_even数据表的偶数样式table.datatable tr.row_selected数据表的选中行样式table.datatable tr.row_active数据表的当前激活表格的选中行样式table.datatable td.indicate数据表的指示器样式n 下拉表格的规范关键字说明table.dropdowntable下拉表格的基本样式table.dropdowntable thead下拉表格的页眉样式table.dropdowntable tbody下拉表格的表格体样式table.dropdowntable tfoot下拉表格的页脚样式table.dropdownt

5、able tr.row_odd下拉表格的奇数行样式table.dropdowntable tr.row_even下拉表格的偶数行样式table.dropdowntable tr.row_selected下拉表格的选中行样式n 编辑框关键字说明.editor编辑框的基本样式.editor_active激活的编辑框的基本样式n 按钮关键字说明.button按钮的基本样式.button_down被按下按钮的基本样式n 数据导航条控件关键字说明table.datapilot数据导航条的基本样式n 树状列表控件关键字说明table.tree树状列表的基本样式table.tree tr.row_odd树状

6、列表奇数行的基本样式table.tree tr.row_even树状列表偶数行的基本样式table.tree tr.row_selected树状列表当前行的基本样式table.tree tr.row_rightclick树状列表的响应当前鼠标右击的行基本样式table.tree .expandbutton树状列表展开按钮的基本样式table.tree .icon树状列表的图标样式n 字段标题控件关键字说明.fieldlabel字段标题的样式n 数据标签控件关键字说明.datalabel数据标签的基本样式n 标签页控件关键字说明.tabset标签页的基本样式.tab标签页中的单个标签的样式n 菜

7、单控件关键字说明table.menu菜单的基本样式table.menu tr菜单行的基本样式table.menu tr.row_selected菜单选中行的基本样式table.menu tr.row_disabled菜单无效行的基本样式n 菜单工具条控件关键字说明table.menubar菜单工具条的基本样式table.menubar .button菜单工具条中按钮的基本样式table.menubar .button_active菜单工具条中当前按钮的基本样式table.menubar .button_hot菜单工具条相应鼠标的按钮的基本样式n 下拉选单的边框控件关键字说明.dropdown_frame下拉选单的边框的样式n 日历控件关键字说明.calendar日历控件的基本样式.calendar .title日历控件页眉的基本样式.calendar .footer日历控件页脚的基本样式.calendar .cell_day日历控件日期单元格的基本样式.calendar .cell_selected日历控件当前单元格的基本样式.calendar .cell_trailing日历中前月和后月的日期单元格的基本样式