当前位置: 首页 > 工具软件 > CMUI > 使用案例 >

cmui

姜彬郁
2023-12-01

cmui超萌框架,快捷布局 
自己写的css布局框架,自适应跨平台设备 

仓库:   https://github.com/womendi/cmui


实例1 webapp网站 AI智能空间 http://www.aiplat.com 
实例2 跨平台app 亲信地铁 腾讯应用宝或苹果appstore搜索‘亲信地铁’、web访问http://m.aiplat.com/metro 
实例3 微信小程序 娱乐计分器 
cmui包含cmreset.css和cmstyle.css、aiplat.css三个css文件,同时生成可用于微信小程序开发的wxss文件 

cmreset.css说明 

1,盒模型采用IE盒子,即css3中的box-sizing值为border-box 

cmstyle.css说明 

1,栅格系统 
请在cmstyle.css文件搜索 ‘栅格系统’ 
兼容pc与mobile写法:(pc端以1200px居中,mobile以100%适配) 
<div class="cm_main2"> 
<div class="cm_main"> 
<ul class="cm_pc_12"> 
<li class="cm_pc_12 cm_mob_6">显示主体div</li> 
<li class="cm_pc_12 cm_mob_6">显示主体div</li> 
<li class="cm_pc_4 cm_mob_12">显示主体div</li> 
<li class="cm_pc_4 cm_mob_12">显示主体div</li> 
<li class="cm_pc_4 cm_mob_12">显示主体div</li> 
</ul> 
</div> 
</div> 

2,div单位主要为em(优于rem),其他部分如border小尺寸单位为px 
例如: .cm_bb1ce{border-bottom:1px solid #eeeeee} 

3,<span class="cm_fs05">cmui</span> 
意思cmui字体大小对应.cm_fs05{font-size:0.5em} 
.cm_fs05中cm为cmui的前缀cm, 
.cm_fs05中fs为font-size两个单词各自的首字母集合,所有类命名均类似 
.cm_fs05中05为0.5em大小,em为如上1说明 
.cm_fs06.....cm_fs3--06、07、08、09、1、11、12、13、15,2,3雷同 .cm_fs3{font-size:3em} 

4,以上三个css文件的说明文档还有很多未写,后续完善,多谢支持与赞. 

兼容性 

1,实测兼容ie8 
2,兼容手机、电脑、平板等等一切联网设备 
3,一次布局,适配所有平台

转载于:https://my.oschina.net/womendi/blog/1815707

 类似资料:

相关阅读

相关文章

相关问答