qq迷你屋商城视觉规范.doc

《qq迷你屋商城视觉规范.doc》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、迷你屋商城视觉规范按钮第一级．原型橙色按钮-特大按钮说明：l用于最需要突出的可点击内容。l一个页面中不易出现多次。l大小不做绝对限制，但应当是该页面上最大的。l使用图片实现，文字字体为“微软雅黑”l文字为白色（#ffffff）第二级．方形紫红-突出显示的按钮说明：l目前共有三种尺寸，见上图。l次于第一级按钮的一种强调表现的按钮样式。l通常不与第一级按钮同时出现。l通常与第三极按钮对比出现。l大小不做绝对限制，但大小应不小于同时出现的第三极按钮。l其中文字使用宋体，可根据按钮大小适当使用12-14px加粗或不加粗的样式。l文字

2、为白色(#ffffff)。第三级．方形浅灰色-不突出按钮说明：l目前共有两种尺寸，见上图。l表现最为不突出的按钮样式。l通常用于与第二级按钮对比出现。l大小不做绝对限制，但大小不应大于同时出现的第二级按钮。l其中文字使用宋体，可根据按钮大小适当使用12-14px加粗或不加粗的样式。l文字为深灰色(#333333)。文字颜色第一种．深灰色-常用正文颜色说明：l色值：#333333l页面上常规出现的文字均使用此种颜色文字。l第三级按钮、tabs中的文字也使用此种颜色文字。第二种．浅灰色-辅助文字颜色说明：l色值：#999999l

3、用于表现页面上较为辅助的信息，例如：文本输入框中的缺省提示信息、间隔线。l页面中不易大量使用此种颜色的文字。第三种．紫红-突出表现的文字颜色说明：l色值：#ff267dl用于表现需要特殊强调的内容。l此种色彩是迷你屋网站的“特色”文字颜色，表现迷你屋页面的主题风格---橙色。链接样式原则上凡事链接文字均加下划线，无论文字本身为什么颜色，均加下划线。Tabs页签Tabs中的文字默认状态不带下划线。状态一．当前tab表现为：当前tab的文字样式：“第三种．突出表现的文字颜色”状态二．非当前tabs表现为：状态三．光标经过非当前t

4、abs时表现为：文字加下划线。背景色第一种．浅灰色色值：#efefef第二种．黄色-特殊强调的背景色说明：l色值：#fffca8l用于表现极其特殊的需要强调的内容，例如：扣费提醒。l不易大量使用此种形式。第三种．橙色-主色彩说明：l色值不做特定要求，在橙黄色范围内即可。l作为与白色背景的反色，配合白色文字使用l“主色彩+白色文字”作为一种组合，用于区别“白色背景+黑色文字”的表现。l可用于页面中需要突出表现的模块背景色。l主色彩不用于按钮背景，不用于文字颜色。单元框有标题栏的添加内容后：（标题栏文字样式可根据实际情况调整，并

5、不是一定要用橙色。）没有标题栏的添加内容后：