优米CSS点缀样式库(umi.css)

优米CSS点缀样式库(umi.css)

umi.css解决web前端页面布局的最后一里路。在对web页面排版布局时,经常有琐碎的细节要另外写样式,umi.css样式库将最常用的碎片样式整合起来,并统一了样式命名规则。 可将umi.css理解为点缀样式库。

umi.css可与任何web框架结合使用。

简单、易记、通用,是优米CSS样式库的设计风格,您可以应用在任何类型的Web项目中,并兼容所有版本的浏览器。 优米CSS免费开源,没有商业用途限制。

umi.css命名规则

umi.css的命名规则是由超过10年开发经验的工程师设计,并兼顾了英文不太好的开发者。

如果您要对umi.css进行拓展,建议您新建一个样式文件umi.ext.css,这样当umi.css有更新时,不会影响您自己拓展的样式。

就算您不打算使用umi.css,但umi.css的命名规则可以由您选择性应用在您的项目中。

圆角


背景色


规则说明:后缀有_p表示色调加深(plus),后缀有_m表示色调减淡(minus)。

边框色


规则说明:后缀有_p表示色调加深(plus),后缀有_m表示色调减淡(minus)。

文本颜色


内容对齐


字体变化


字体大小


内边距


更多使用方式: 四周相同的样式也可单独某一边使用(上=t,下=b,左=l,右=r),比如:c_padd_t_2=内上边距2px,以下是部分样式效果。

外边距


更多使用方式: 四周相同的样式也可单独某一边使用(上=t,下=b,左=l,右=r),比如:c_marg_t_2=外上边距2px,以下是部分样式效果。

定位


元素浮动


行高


内容溢出显示方式


列表序号


按钮组件


组件样式:后缀有_p表示大1号(plus),后缀有_p2表示大2号,后缀有_m表示小1号(minus)。

标签组件


选项组件(v1.5.1新增,限CSS3环境)


勾选框-默认风格:

勾选框-风格2:

下载


© 2018 华米软件 MIT license

苏州华米软件研发