BootStrap虽然用户群体广大,其整体风格尽管有不少skin可选,但以国情来看还是不好看。
阿里开源的前端框架,个人觉得还是很不错,Alice处处透着支付宝中界面风格的气息,电商感挺强。
以下内容摘自:
Alice 的样式模块组织方式追求扁平化的方式,分为三个层级:
基础框架(reset + iconfont + 栅格)
通用模块(符合 Alice 规范的样式模块)
页面样式(继承通用模块)
什么是模块化的样式Alice 对于模块化样式的理解是任何模块在页面上都应该像一个盒模型,不和页面的其他元素互相影响。 完美的 Alice 模块应该是一个“口”字型结构。比如 box 模块:
ui-box 模块能够嵌到页面上任何一个位置,box 内部也能够嵌入别的模块(如图中的 ui-list 模块),它们之间不会互相影响。
怎样才能写出模块化的样式一种简单的方式是使用 Alice 的类命名规范,当团队中都能采用这种方式书写样式,就能很好地避免样式冲突。 在模块化和命名上,以一个 Tab 模块为例,分解如下:
值得注意的是:
模块名是必选的。
名字要求是表意的,一眼就基本能看出模块是做什么的。
模块内部的类名继承于上层的名称。
比如:
<div class="ui-box"> <h3 class="ui-box-title"></h3> <p class="ui-box-conent"></p> </div>