Web界面设计规范说明.docx
- 文档编号:12031421
- 上传时间:2023-04-16
- 格式:DOCX
- 页数:11
- 大小:34.54KB
Web界面设计规范说明.docx
《Web界面设计规范说明.docx》由会员分享,可在线阅读,更多相关《Web界面设计规范说明.docx(11页珍藏版)》请在冰豆网上搜索。
Web界面设计规范说明
Web界面设计规范
DesignSpecificationforWebUI
(仅供内部使用Onlyforinsideof****)
作者:
********
日期:
2005年5月31日
****财务HFS
版权所有不得复制
Copyrightby****2005,Allrightsreserved
Web界面设计规范-文档修改记录
DesignSpecificationforWebUI—RevisionHistory
版本号
Version
日期
RevisionDate
所修改页
RevisionPages
注记
Summary/Comment
修改人
Signature
1.0
2005/5/31
ALL
Create
Ben
1.1
2005/6/6
5-10
增加部分规范
XY
目录
一、目的4
二、适用范围4
三、文件命名规范4
四、控件命名规范4
五、控件外观规范5
六、界面设计规范6
6.1字体6
6.2颜色7
6.3边距7
6.4尺寸单位7
6.5表格排版规范7
6.5.1表格代码对齐7
6.5.2表格高宽8
6.5.3表格其他规范8
七、其他规范9
7.1网站目录结构9
7.2排版规范9
7.2客户端脚本10
7.3状态管理10
一、目的
为了使最终设计出来的Web界面风格一致化,开发者之间相互协作更轻松,特制定此Web界面设计规范!
回目录
二、适用范围
1.此规范适合所有WebForm的UI设计。
2.有关WindowsForm的UI设计请参考<<Windows界面设计规范>>。
回目录
三、文件命名规范
WebForm
扩展名
ExtensionFileName
描述
Description
前缀
Prefix
.aspx
/
.ascx
Web用户自定义控件
wuc
回目录
四、控件命名规范
控件类型
ControlType
前缀
Prefix
例子
Example
Label
lbl
lblTip
TextBox
txt
txtName
Button
btn
btnOK
LinkButton
lbtn
ImageButton
ibtn
HyperLink
hlk
DropDownList
ddl
ListBox
lst
DataGrid
grd
DataList
dlst
Repeater
rep
CheckBox
chk
CheckBoxList
chklst
RadioButtonList
rdolst
RadioButton
rdo
Image
img
Panel
pan
PlaceHolder
plh
Calendar
cld
AdRotator
adr
Table
tbl
RequireFieldValidator
rfv
CompareValidator
cpv
RangeValidator
rgv
RegularExpressionValidator
rev
CustomValidator
cstv
ValidationSummary
vls
Xml
xml
Litteral
ltl
CrystalReportViewer
crv
回目录
五、控件外观规范
说明:
{50px|文本宽度},表示该参数可以的取值为:
“50px”或者“文本宽度”
控件类型
ControlType
宽度(像素)
Width(px)
高度(像素)
Height(px)
备注
Remark
Label
{适应文本}
{适应文本}
TextBox
{150px|100%|超短|超宽}
{默认值}
Button
{50px|文本宽度}
{默认值}
LinkButton
{适应文本}
{适应文本}
ImageButton
{适应图片}
{适应图片}
HyperLink
{适应文本}
{适应文本}
DropDownList
{150px|100%|适应文本}
{默认值}
ListBox
{150px|100%|适应文本}
{100px|适应项目数|按需}
DataGrid
{按需}
{按需}
DataList
{按需}
{按需}
Repeater
{按需}
{按需}
CheckBox
{适应文本}
{默认值}
CheckBoxList
{适应文本}
{适应项目}
RadioButtonList
{适应文本}
{适应项目}
RadioButton
{适应文本}
{默认值}
Image
{适应图片}
{适应图片}
Panel
{适应内部控件|按需}
{适应内部控件|按需}
PlaceHolder
{适应内部控件|按需}
{适应内部控件|按需}
Calendar
{按需}
{按需}
AdRotator
{按需}
{按需}
Table
{按需}
{按需}
RequireFieldValidator
{适应文本}
{默认}
CompareValidator
{适应文本}
{默认}
RangeValidator
{适应文本}
{默认}
RegularExpressionValidator
{适应文本}
{默认}
CustomValidator
{适应文本}
{默认}
ValidationSummary
{默认}
{默认}
Xml
{默认}
{默认}
Litteral
{默认}
{默认}
CrystalReportViewer
{默认}
{默认}
回目录
六、界面设计规范
6.1字体
所有Web界面基准字体大小一律为:
9pt。
字体序列为:
Verdana,Arial,Helvetica,Sans-Serif。
所有字体设定应在CSS中完成。
6.2颜色
颜色应以清爽简洁为准,所有色彩设定应在CSS中完成。
6.3边距
页,表格都应该有边距,避免紧贴边沿的情况发生,最小边距值为“3px”,默认边距值应在CSS中设定。
6.4尺寸单位
所有字体尺寸一律采用“pt”作为单位,对象和线条的尺寸一律用“px”作为单位。
6.5表格排版规范
6.5.1表格代码对齐
在写
缩进一个TAB, | 中如果还有嵌套的表格,
|