书签 分享 收藏 举报 版权申诉 / 12
立即下载 加入VIP,免费下载
当前位置： 首页 > 小学教育 > 小学作文 > 开发部web界面设计规范.doc

类型开发部web界面设计规范.doc

  • 文档编号：237605
  • 上传时间：2022-10-07
  • 格式：DOC
  • 页数：12
  • 大小：326KB
下载好就可以显示，所有速度快。

3.易于维护和改版，只要简单的修改几个CSS文件就可以重新设计整个网站的页面。

例如

layout.css

body{font-family:

Verdana;font-size:

14px;margin:

0;}

#container{margin:

0auto;width:

100%;}

#header{height:

100px;background:

#9c6;margin-bottom:

5px;}

#menu{height:

30px;background:

#693;margin-bottom:

5px;}

#mainContent{height:

500px;margin-bottom:

5px;}

#sidebar{float:

left;width:

200px;height:

500px;background:

#cf9;}

#sidebar2{float:

right;width:

200px;height:

500px;background:

#cf9;}

#content{margin:

0205px!

important;margin:

0202px;height:

500px;background:

#ffa;}

#footer{height:

60px;background:

#9c6;}

index.html

ThisistheHeader

ThisistheMenu

Thisisthesidebar

Thisisthesidebar2

3列左右侧固定，中间列自适应居中+头部+导航+尾部

Thisisthefooter

效果

4.边距规范

页、表格都应该有边距，避免紧贴边沿的情况发生，最小边距值为“3px”，默认边距值应在CSS中设定。

5.字体规范

1）字体尺寸使用pt为单位，对象和线条使用px为单位。

基准字体为9pt；

2）字体尽量采用Verdana,Arial,Helvetica,sans-serif,宋体。

一个页面最多包含两种字体；

3）所有字体设定应该在CSS中完成。

6.颜色规范

1）尽可能通过选择合适的主题颜色或系统颜色来选择颜色；

2）不要混用颜色类型。

也就是说，不要同时运用多个主题颜色。

使用主题颜色外的颜色时最好从主题颜色派生，而不是硬编码颜色值；

3）尽量限制色彩的数目。

4）应当根据对象的重要性来选择颜色，重要对象用醒目的颜色表示；

5）使用颜色的时候应当保持一致性，如错误提示用红色表示就要在其他时候保持一致；

7.输入框规范

1）当打开一个页面时光标默认停留在第一个输入的文本框。

2）当选择下拉框存在默认值时要默认选中。

不存在默认值时，则默认为“请选择”，不要空着。

3）必填项必须以红色*号标识。

4）当必填项没有填写时，可在光标移走时在文本框后以红色文字提示。

5）总给输入框提供一个标签来标明它的用途，且主要对齐。

6）关闭弹出提示框提示出错后，要把焦点定位在出错的输入框。

7）只允许输入数字的输入框要控制输入的非法字符，而不是输入非法字符后给予提示。

8）只允许输入日期、时间的输入框要给予格式化。

9）输入内容的长度要限制，默认对应数据库相关字段的长度。

10）对非法的字符的控制，限制输入或给予提示。

11）只读文本框（灰色）和可输入文本框（白色）在颜色上必须区分。

12）文本框上下或左右对齐。

13）输入框没输入时尽量在框里有相应hint文字提示。

8.搜索框规范

1）搜索框文本框的长度应适中，至少应提供显示10个中文字符的宽度

2）搜索组件中使用的文本框必须为单行文本框

3）文本框的长度不得少于130个像素，高度不得低于18个像素

4）文本框要有标示性文字（即hint提示），颜色为灰色#cccccc，搜索按钮可突出显示

9.提示框规范

1）提示信息中的标点符号统一为全角符号。

2）复杂的操作在成功后给予提示信息。

3）提示信息不宜过长，宽度不能超过窗口的1/2，内容可考虑换行，不要滚动显示。

4）窗口应居中显示。

5）当按钮为图片按钮时，光标停留时需给予浮动提示。

6）选择默认按钮，将最安全的或最常用的选项作为默认按钮。

10.键盘支持规范

1）支持回车键提交。

2）支持tab键移动光标焦点，使用tabindex属性改变移动顺序。

11.鼠标

1）在整个交互式语境地中，需可以识别鼠标操作；

2）支持滑轮（鼠标中间的滚动轮）上下翻动操作；

3）对于相同种类的元素采用相同的操作激活；

4）用沙漏表示系统忙，用手型表示可以点击；

12.表格列表规范

1）在写 

 互相嵌套时，严格按照的规范，对于单独的一个
来说，
对齐，
 缩进一个TAB， 中如果还有嵌套的表格，也缩进TAB，如果 结束标记应该与 
中没有任何嵌套的表格， 处于同一行，不要换行。

如

2）表头水平/垂直居中对齐。

3）表格中内容如为定长，则居中显示；如为不固定的中英文内容，则为居左显示；如为数值，则居右显示。

4）保证表格的宽度不被挤压变形，对于不定长的内容，可以固定宽度。

当超出此宽度后，以省略号显示，光标停留后，详细内容再浮动显示。

5）表格的嵌套控制在三层以内。

举报
举报 版权申诉
版权申诉 word格式文档无特别注明外均可编辑修改；预览文档经过压缩，下载后原文更清晰！ 立即下载
配套讲稿：

如PPT文件的首页显示word图标，表示该PPT已包含配套word讲稿。双击word图标可打开word文档。

特殊限制：

部分文档作品中含有的国旗、国徽等图片，仅作为作品整体效果示例展示，禁止商用。设计者仅对作品中独创性部分享有著作权。

关 键  词：
开发部 web 界面设计 规范
提示  冰豆网所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。
关于本文
本文标题：开发部web界面设计规范.doc
链接地址：https://www.bdocx.com/doc/237605.html
关于我们 - 网站声明 - 网站地图 - 资源地图 - 友情链接 - 网站客服 - 联系我们

copyright@ 2008-2022 冰点文档网站版权所有

经营许可证编号:鄂ICP备2022015515号-1

收起
在线客服
意见反馈
返回顶部
展开
QQ交谈
返回顶部