简单整理appcan [base] [box] [color] class

摘要

appcan UI 官方的class名,
自己整理了一下,

简单整理appcan [base]   [box]   [color] class

base

uc-[l类型][类别]。。 用于定义不同的圆角
类型为t带表TOP,l代表LEFT,b代表BOTTOM,r代表RIGHT,a代表ALL
类别为数字编号,用于定义不同大小的圆角
us[类别(数字)] 用于定义不同大小和不同颜色的外阴影
us-i[类别] 用于定义不同大小和不同颜色的内阴影
uts 用于定义文字阴影大小及阴影颜色
um-vp 定义body的内边距padding,外边距margin的大小以及文字大小可以调整,超过body宽度的部分隐藏
up 一般和um-vp搭配使用,用于定义页面大小自适应手机屏幕大小
<body class='um-vp'><div class='up'></div></body>
uh 和uf定义头部和底部的元素的一些基本属性
ut 定义头部和底部的内边距和外边距的大小
uf[类型] 定义元素的浮动方向
ulev[类别(数字)] 用于定义不同大小的字体,数值越大,字体越大
ulim 定义元素的最大宽度超过部分省略
uinl 用于定义元素为行内元素
uinn[类别(数字)] 用于定义内边距的大小(上下左右)
umh[类别(数字)] 用于定义不同大小的最大高度
umw[类别(数字)] 用于定义不同大小的最小宽度
ut-s 用于定义文本超过容器指定宽度时文字隐藏并且文字不换行
ub[类型(数字)] [类型(数字)] 边框 t l b r a
uhide 代表元素隐藏display属性为none
umar-[类型] 定意外边距的大小
uof-[类型] 内容溢出元素框时,超出的部分隐藏
uabs 定义元素位于页面的左上角

box

ub 定义元素的display属性为box(以下需要搭配ub使用)
ub-f[1~4] 定义不同的元素空间大小分配比例
ub-ac 元素垂直居中
ub-ae 元素位于底边
ub-pc 元素水平居中
ub-pe 元素位于末尾
ub-pj 元素两端对齐
ub-ver 定义元素垂直排列
ub-con 在子元素中加入一个容器,用于避免内容引起子元素大小变化
ub-rev 定义元素排列方向
ub-fv 在box架构中ub-fv一般跟函数iScroll()搭配着使用实现纵向滑动效果
ub-img[类别(数字)] 用于定义不同的背景排列方式
ub-img1类别为1, 定义将背景图片等比例缩放到完全覆盖容器,背景图像有可能超过容器
ub-img2类别为2,定义背景图像横向平铺
ub-img3类别为3,定义背景图像纵向平铺
ub-img4类别为4,定义背景图像横向100%,纵向自适应;
ub-img5类别为5,定义背景图像横向自适应,纵向为100%
ub-img6类别为6,定义背景图像居中显示
color

bc-head类别: 基础header颜色;定义了header区域背景底色,在ui3.0框架中,IDE工具可以可视化配置
bc-bg类别: 基础body背景颜色; 定义了body背景底色,在ui3.0框架中,IDE工具>插入控件,可视化配置
sc-bg类别: 辅助控件背景颜色1; 定义了辅助控件背景底色,在ui3.0框架中,IDE工具>插入控件,可视化配置
sc-bg-active类别: 辅助控件背景颜色2; 定义了辅助控件背景底色,在ui3.0框架中,IDE工具>插入控件,可视化配置
sc-bg-alert类别: 警告背景色; 定义了header区域背景底色,在ui3.0框架中,IDE工具>插入控件,可视化配置
bc-btn 基础按钮颜色 应用的是主题颜色
sc-btn 辅助按钮颜色 应用的是主题颜色
bc-text 基础字体颜色 black
bc-text-head 基础标题字体颜色 white
sc-text 辅助字体颜色1 #848484
sc-text-active 辅助字体颜色2 应用的是主题颜色
sc-text-hint 辅助字体颜色3
sc-text-warn 辅助字体颜色4
sc-text-tab 辅助字体颜色5
bc-border 基础边框颜色 默认是#BABABA
sc-border 辅助边框颜色 默认是#FFFFFF
sc-border-tab 辅助边框颜色 应用的是主题颜色

李东辉

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:23   其中:访客  15   博主  8

  1. avatar 广东硅谷学院 0

    #广东硅谷学院#学好IT好就业选硅谷IT,学技能拿文凭事半功倍,紧跟专业教师一起冲浪IT行业。我们有建设学习型专业师资团队,教师领跑学生紧随其后。(QQ:800015777,电话0754-88989555)

  2. avatar 森云 5

    哇哦,这些都是什么啊博主

  3. avatar 黑鹰hyx8电棍 0

    博主交换个链接吧
    黑鹰x8电棍http://www.zgdiangun.com/diangun/jiachangdiangun/89.html

  4. avatar 森云 5

    过来溜达溜达

  5. avatar 威客兼职 1

    咯咯咯咯咯 密密麻麻的

  6. avatar 起重机安全监控系统 1

    看的有点晕,是给忖业人看的吧

  7. avatar 律通律师事务所管理软件 2

    谢谢分享

  8. avatar 7号娱乐 2

    貌似很厉害的样子 先留言

  9. avatar 卢松松商城 0

    感觉好高大上的样子

  10. avatar 小易分享网 5

    不错学习了,谢谢分享! http://www.xevip.cn

  11. avatar 奇虎分享网 5

    写的不错哈,支持一下

  12. avatar VIP灵儿网 5

    今天才发现你的博客,连着看了几篇呢 http://www.viplinger.cn

  13. avatar www.3gwb.com 5

    哎呦,不错哦!欢迎互访! 诚交友链 站务申请:www.3gwb.com

  14. avatar www.tmcore.com 5

    今天才发现你的博客,连着看了几篇呢! 欢迎回访:www.tmcore.com