前端UI框架

赵永逸
2023-12-01
Bootstrap:
这里可以找到很多
Bootstrap中文网

即使Bootstrap已经如此成功,Mark他们也并没有停下探索与不断创新的脚步。

伴随着7月的即将落幕,Bootstrap3携带着清新逼人的全新扁平化设计以及更多的功能扩展发布了!

与Bootstrap2相比较,Bootstrap3除了UI进行了翻天覆地的变化之外,其他各方面也进行了大幅度的改动。

扁平化设计、响应式布局、 移动优先……或许Bootstrap3会是你下一个爱不释手的前端开发框架。

Flat UI Flat UI是一套精美的扁平风格 UI 工具包,基于  Twitter Bootstrap   实现。 地址: designmodo/Flat-UI · GitHub .       http://designmodo.com/ 

BootMetro  基于 Twitter  Bootstrap   框架构建,用于创建 Windows 8 的 Metro 风格的网站,灵感来自于  Metro UI CSS   。地址: https://github.com/aozora/bootmetro 
  1.  
  2. Fbootstrapp 是一个基于 Bootstrap  提供了跟 Facebook iframe apps 和设计的功能。包含基本的 CSS 和 HTML 用于所有标准组件,包括排版、表单、按钮、表格、网格、导航等等,风格跟 Facebook 类似。地址:ckrack/fbootstrapp 路 GitHub


NEC:更好的CSS方案。 适合深度定制化。

读规范,让你的代码更具智慧和美丽的方法

用框架,选择一份合适的HTML和CSS基础代码

找代码,在这里找到她,或给你启发,或她就是你的

装插件,帮助你快速有效的使用代码库

jQuery EasyUI


作为一个基于 jQuery的前端框架,EasyUI为开发者们提供了相当不错的CSS、JavaScript以及其他扩展代码。

相较于ExtJS而言,它更加轻量级,但是却依然拥有强大的功能。

另外,由于它是完全基于HTML5框架开发,所以对于最新的HTML5支持力度也是相当不错。

jQuery UI Bootstrap 提供了在  jQuery UI   集成 Twitter 的  Bootstrap   框架的功能。地址: jquery-ui-bootstrap/jquery-ui-bootstrap · GitHub


Bootswatch :

Modular   Easy to Install  Free themes for Bootstrap

只有 Bootstrap 就太单调啦,试试 Bootstrap + Bootswatch 吧,给 Bootstrap 添加了不少主题,丰富多彩多了。



 UIkit : less  components customizer  responsive
gives you a comprehensive collection of HTML, CSS, and JS components
which is simple to use, easy to customize and extendable. 


Pure   A set of small, responsive CSS modules that you can use in every web project.轻量级。Pure是由YUI推出的一款相当强大的前端开发框架,正如它的名字所形容的一样,整个框架的UI看起来纯洁简单,没有任何多余的修饰。

除此之外,它的扁平化设计风格顺应现在的网站页面设计潮流,更容易与CSS3技术相结合从而产生更加优雅的交互效果。

而响应式布局的加入,也使得Pure在各个设备终端都可以得心应手。

由于YUI在前端领域的不俗地位,所以使得Pure也获得了大多数前端开发者的青睐。

如果你也想要拥有一个相当“Pure”的网站,何不尝试一下这个令人倍感清爽的前端开发框架呢?Pure 是来自雅虎的 CSS 框架,使用 Normalize.CSS  无需任何 JavaScript 代码。框架基于响应式设计,提供多种样式的组件,包括表格、表单、按钮、表、导航等。标识使用非常简单,整个框架非常轻量级,压缩后只有 5.7kb。地址:yui/pure 路 GitHub



Foundation

Semantic  mobile first  customizable 

The most advanced responsive front-end framework in the world.来自知名设计公司Zurb的Foundation,要注意这个框架是使用Sass+Compass的,需要ruby运行环境,面对的用户以需要深度定制的高端企业为主:作为Foundation这个前端开发框架的开发团队,Zurb让越来越多的前端开发人员尝试到了Foundation带来的甜头。

从Foundation的文档中我们可以看出,它的风格样式更加趋向于“伪扁平化”——简单的高光纹理,利索的图像结构,确实构造出了自己有别于其他UI框架的风格特色。

而独特的低饱和度的UI色彩搭配,使得整体的页面样式更加低调柔和。

如果你喜欢这种独特的感觉,那么不妨试试这个口碑爆棚的前端开发框架。
Foundation 是一个易用、强大而且灵活的框架,用于构建基于任何设备上的 Web 应用。提供多种 Web 上的 UI 组件,如表单、按钮、Tabs 等等。地址: Foundation | The Most Advanced Responsive Front-end Framework from ZURB

来自创业团队的Semantic-UI,和Bootstrap一样基于LESS,但比起Bootstrap乱七八糟的类名,Semantic-UI强调语义化的类名,并且在样式组合和冲突处理上做的比较优雅,个人用户值得一试:
Semantic UI—完全语义化的前端界面开发框架,跟  Bootstrap   和  Foundation   比起来,还是有些不同的,在功能特性上、布局设计上、用户体验上均存在很多差异。地址: Semantic-Org/Semantic-UI · GitHub
http://semantic-ui.com/ 


Kraken:Responsive Grid   Typography

 A lightweight, mobile-first boilerplate for front-end web developers. 


goratchet.com    同是Twitter出品的,就是功能还是有点少

Cardinal:less  responsive

Build more with less.

Cardinal is a small “mobile first” CSS framework for front-end developers who build responsive web applications.


EZ-css:

putting the "less" in tavle-less layouts.

http://www.ez-css.org/




移动端:

ionic:Create amazing apps

The beautiful, open source front-end framework for developing hybrid mobile apps with HTML5.



Spirit

HTML移动开发的: 
jQTouch  http://jqtouch.com/    
Sencha Touch  http://www.sencha.com/products/touch/    

Less Framework 4  http://lessframework.com/    
iui  http://code.google.com/p/iui/    
HTML5 Boilerplate  http://html5boilerplate.com/    
ChUI  http://www.chocolatechip-ui.com/    

SproutCore  http://www.sproutcore.com/    

xui  http://xuijs.com/    
jo  http://joapp.com/    
jquery mobile
有些偏重CSS,有些偏重JS,还整体解决方案的,比如 phonegap。 
个人觉得偏重CSS比较好,用CSS来自定义各种主题。
 类似资料: