《AppCanUIClass参考》由会员分享，可在线阅读，更多相关《AppCanUIClass参考（77页珍藏版）》请在金锄头文库上搜索。
1、DEV文档 开发文档 APP UI css文档目录ui-bar1.ui-bar-a2.ui-bar-b3.ui-bar-c4.ui-bar-d5.ui-bar-e6.ui-bar-glass设立渐变条的边框，字体颜色，字体阴影等效果 1.ui-bar-a阐明表达有1px边框的颜色渐变条，字体颜色，加粗有阴影的效果 代码示例Title 图例2.ui-bar-b阐明表达有1px边框的颜色渐变条，字体颜色，加粗有阴影的效果 代码示例Title 图例3.ui-bar-c阐明表达有1px边框的颜色渐变条，字体颜色，加粗有阴影的效果 代码示例Title 图例4.ui-bar-d阐明表达有1px边框的颜色渐
2、变条，字体颜色，加粗有阴影的效果 代码示例Title 图例5.ui-bar-e阐明表达有1px边框的颜色渐变条，字体颜色，加粗有阴影的效果 代码示例Title 图例6.ui-bar-glass阐明表达从0%的0.25透明的白色到50%的0.25透明白色到50%的全透明100%的全透明的渐变色，类似于半透白色的玻璃罩效果 代码示例第一页 图例6.其她关联不同效果的渐变条ui-bar-a,ui-bar-a input,ui-bar-a select,ui-bar-a textarea,ui-bar-a buttonui-bar-a .ui-link-inheritui-bar-a .ui-link
3、目录ui-body1.ui-body-a2.ui-body-b3.ui-body-c4.ui-body-d5.ui-body-e设立某区域样式 1.ui-body-a阐明设立某区域的样式：背景颜色渐变，有实线边框，区域内的字体原则并且字体颜色带阴影等样式，如下图 代码示例ui-body-a图例2.ui-body-b阐明设立某区域的样式：背景颜色渐变，有实线边框，区域内的字体原则并且字体颜色带阴影等样式，如下图 代码示例ui-body-b图例3.ui-body-c阐明设立某区域的样式：背景颜色渐变，有实线边框，区域内的字体原则并且字体颜色带阴影等样式，如下图 代码示例ui-body-c图例4.u
4、i-body-d阐明设立某区域的样式：背景颜色渐变，有实线边框，区域内的字体原则并且字体颜色带阴影等样式，如下图 代码示例ui-body-d图例5.ui-body-e阐明设立某区域的样式：背景颜色渐变，有实线边框，区域内的字体原则并且字体颜色带阴影等样式，如下图 代码示例ui-body-e图例6.其她关联.ui-body-a,.ui-body-a input,.ui-body-a select,.ui-body-a textarea,.ui-body-a button.ui-body-a .ui-link-inherit .ui-body-a .ui-link目录ui-btn1.ui-btn-
5、a,ui-btn-b,ui-btn-c,ui-btn-d,ui-btn-e2.其她有关联类设立页面中按钮样式 1.ui-btn-a,ui-btn-b,ui-btn-c,ui-btn-d,ui-btn-e阐明ui-btn-a可以设立按钮的边框样式、边框颜色和宽度，按钮的背景，按钮中字体颜色、字体阴影等样式以上五种类名给出了不同背景颜色的按钮示例，如下图例中 代码示例按钮图例其她有关类不同类名组合可以实现各位置处（如header，footer，bar）按钮的不同风格样式，具体如下 .ui-btn：设立按钮的样式 .ui-btn:focus,.ui-btn:active：按钮聚焦外轮廓为0 .ui-
6、header .ui-btn,.ui-footer .ui-btn,.ui-bar .ui-btn：header，footer，bar中的按钮样式 .ui-btn-limit：按钮的最大宽度为5em .ui-btn-inline：按钮显示为行内属性 .ui-btn-inner：按钮内部的样式 .ui-header .ui-btn-inner,.ui-footer .ui-btn-inner,.ui-bar .ui-btn-inner：按钮在header，footer，bar中的内边距样式 .ui-block-auto .ui-btn-thumb-notext,.ui-block-a .ui-b
7、tn-thumb-notext,.ui-block-b .ui-btn-thumb-notext,.ui-block-c .ui-btn-thumb-notext,.ui-block-d .ui-btn-thumb-notext,.ui-block-e .ui-btn-thumb-notext,.ui-block-f .ui-btn-thumb-notext:图片按钮在网格中的样式布局 .ui-btn-thumb-notext .ui-btn-inner：无文本的图片按钮内边距样式 .ui-btn-thumb-notext：无文本的图片按钮内边距样式 .ui-btn-thumb-notext
8、.ui-btn-text：图片按钮无文本的文本按钮位置 .ui-btn-icon-notext：只有icon，无文本的按钮样式 .ui-btn-icon-notext .ui-btn-inner：icon按钮距内边距的样式 .ui-btn-icon-notext .ui-btn-text：icon按钮无文本的文本按钮位置 .ui-btn-icon-left .ui-btn-inner：icon按钮的左边内边距位置 .ui-header .ui-btn-icon-left .ui-btn-inner,.ui-footer .ui-btn-icon-left .ui-btn-inner,.ui-b
9、ar .ui-btn-icon-left .ui-btn-inner：icon按钮在header，footer，bar中的左边内边距位置 .ui-btn-icon-right .ui-btn-inner：icon按钮距右边距的内部样式 .ui-header .ui-btn-icon-right .ui-btn-inner,.ui-footer .ui-btn-icon-right .ui-btn-inner,.ui-bar .ui-btn-icon-right .ui-btn-inner：icon按钮在header，footer，bar中的右边内边距位置 .ui-btn-icon-top .ui-btn-inner：带icon的按钮距上边内边距的位置 .ui-btn-thumb .ui-btn-inner：图片按钮距上边内边距的位置 .ui-header .ui-btn-icon-top .ui-btn-inner,.ui-footer .ui-btn-ico
