您的位置:时时app平台注册网站 > web前端 > 最流行的5个前端框架对比彩世界网址

最流行的5个前端框架对比彩世界网址

2019-09-14 00:46

Notes on Foundation

Foundation 是三个提供业务支撑、培养陶冶和提问真正标准的框架。它还提供了许多财富扶持您越来越快和更便于学习和利用框架。

本人选用的那些框架是依赖它们在 Github 的受招待程度来的,而最受接待的终将是 Bootstrap。

Semantic UI说明

Semantic是此处所商量的享有框架中,最具革新性和全职能的框架。其框架的全体布局、类中明晰逻辑的命名约定格局和语义方面也超越了其余框架。

Notes on Pure

Pure只提供贰个宗旨的风格,让你的种类有三个到底的伊始。对于职业中无需一个全职能的框架只必要有一定的零部件的人来讲是最美丽的。

3.Semantic UI

Semantic UI 一向在持续前进,创设更具语义的 Web 网站。其行使自然语言原则,使得代码尤其具备可读性和轻巧通晓。Semantic UI是最具立异以及全职能的框架。框架的完全结构和命名都有醒指标逻辑和语义,在这上头碾压其余框架。

彩世界网址 1

* 作者:Jack Lukic

* 公布时间: 二零一一

* 当前版本: 2.2

* 受招待程度: 在 Github 上获取 34,762 个赞

* 项目描述: “二个 UI 组件框架,基于自然语言特点”

* 宗旨概念: 语义、标签、响应式

* 框架谈起: 806 KB

* 预管理器: Less

* 响应式: Yes

* 模块化: Yes

* 模板布局: 匡助,提供一些基础模板

* 图标集: Font Awesome

* 扩展、插件: No

* 独特组件: Divider, Flag, Rail, Reveal, Step, Advertisement, Card, Feed, Item, Statistic, Dimmer, Rating, Shape.

* 文书档案: 相当棒,组织杰出,提供入门、定制和宗旨创制.

* 定制: 不提供 GUI 定制器,唯有手工业定制

* 浏览器协理: Firefox, Chrome, Safari, IE10 (IE9 with browser prefix only), Android 4, Blackberry 10

* 许可证: MIT

Pure说明

Pure为您的种类提供了一个到底的始发,只提供基本框架。对于无需全职能框架但仅饱含在其行事中的特定组件的人的话,pures是三个能够的取舍。

二〇一四年5个最风靡前端框架比较

2015/01/08 · CSS, HTML5 · bootstrap, Foundation, Pure, Semantic UI, UIkit, 前端框架

本文由 伯乐在线 - kinolee 翻译,JustinWu 校稿。未经许可,禁止转发!
乌Crane语出处:www.sitepoint.com。迎接参预翻译组。

这段时间时期众多CSS的前端框架纷涌而至,但实在的特出的却寥寥无几。

在那篇小说中我们将对作者以为最棒的多少个框架举办比较,各个框架都有友好优弱点和特定的应用领域,那允许你依照特定项指标要求采用适宜的框架。譬如,假设您的门类相比轻易,你就无需复杂的框架,其它,多数抉择是模块化的,那允许你仅使用你要求的机件,或然夹杂使用不一致框架的零件。

大家要探讨的框架都以依附其在github上的知名度体现的,首先说最风靡的,当然是:Bootstrap。

(注意:上面的部分信息在今后的几周和几月后就过时了,如:GitHub 上的评分(Stars)和本子数,由此一旦您是在那篇小说发表比较久未来阅读的话,你须求留神这或多或少。另外,还要当心框架大小是不是将供给的CSS和JS文件最小化。)

 6.Milligram

彩世界网址 2

Milligram 提供了极简样式设置,便于你急忙、简洁的拉开建站之旅。即便它不是二个 UI 框架,但它的安排性思想却是以提供不错的性质、高效的付出功效以及最少的习性重新初始化而构建的。相同的时候,它也是轻量的,在 Gzip 压缩后,它独有 2KB 大小。

7.AmazeUI

彩世界网址 3

何以是最契合你的框架?

在选用框架时,能够从以下多少个地点思念:

所选的框架有足够的名气吗?越多的人气意味着越来越多的圆出席项目,也表示有越多的科目和社区篇章、越来越多的实例和网址、越来越多的第三方增添、更加好的连锁的Web产品可与其集成。受应接程度也意味框架更具前瞻性,因为有着越来越大社区的框架不太大概被撇下。
框架是或不是正在积极上进?多个好的框架须要持续地选拔最新的web手艺,极度是在移动端方面。

框架是还是不是达到成熟?就算二个特定的框架在切实可行项目中还未曾被采用和测量试验,那么将其用于你的正儿八经项目,大概不是多个睿智的选项。

框架是或不是提供了一语双关的文书档案?为了有助于学习进程,总是要求能够的文书档案。

框架的特异性是什么样?这里的要点是,与具备高档别特异性的框架相比,更通用的框架更便于选取。在大部情形下,最佳选拔二个利用最小样式的框架,因为它更便于自定义。与重写现存的CSS准则比较,增多新的CSS准绳是贰个更利于有效的做法。

假如你还不分明使用哪个框架,那么能够应用混合着去搭配的不二秘技。当某些特定的框架不能够知足你的急需时,能够勾兑使用八个或七个门类的机件。

末段值得一说的是,当今Flexbox和Grid Layout在主流浏览器的风靡版本中获取很好的援助,比在此以前别的时候都更易于创设复杂的布局。那说不定会鼓劲更加多的开辟职员屏弃前端框架,从头开首编写他们友善想要的布局。


如上为私家观点,如有雷同,纯属巧合,应接我们多提意见!Bey 了 个 Bey ~

Notes on Semantic UI

Semantic 是此处研商的最立异和效应最周到的框架。在框架的总体布局和命名约定方面,也以清晰的逻辑和语义类超越了别的框架。

5.UIkit

彩世界网址 4

UIkit 是多个轻巧使用和定制的总结组件集结。就算与其竞争对手相比,受接待程度没那么高,可是它一样提供了扳平的功效和品质。

* 所属:YOOtheme

* 发表时间: 二零一二

* 当前版本: 3.0.0

* 受欢迎程度: 在 Github 收获 9,422 个点赞

* 描述: “八个轻量级模块化的前端框架,用于急速支付庞大的 Web 分界面”

* 主旨概念: 路虎极光WD, 移动优先

* 框架谈到: 326.9 KB (384.4 KB 假设含有 uikit-icons.min.js 和血脉相通 SVG Logo时)

* 预管理器: Less, Sass

* 响应式: Yes

* 模块化: Yes

* 模板/布局: Yes

* Logo集: UIkit 富含本身的 SVG 图标系统和库

* 插件/扩展: Yes

* 独特组件: Article, Flex, Cover, HTML 艾德itor

* 文档: Good

* 定制: 高档 GUI 定制器,只在本子 2 中提供

* 浏览器帮助: Chrome, Firefox, Safari, IE9

* 许可证: MIT

Foundation说明

Foundation是多个真的的正式框架,提供工作支撑、培养演练和咨询。它还提供了众多财富来援救你越来越快更轻巧地读书和应用该框架。

有关笔者:kinolee

彩世界网址 5

今日头条博客园:@木冬虫夏草 个人主页 · 作者的文章 · 12

彩世界网址 6

4.Pure

Pure 是多个轻量级、模块化的框架,使用纯 CSS 编写,其富含的有所组件都足以在一同也许独立使用。

彩世界网址 7

* 所属: Yahoo

* 发布时间: 二〇一二

* 当前版本: 0.6.2

* 受款待程度: 在 Github 收获 16,637 个点赞

*  描述: “一组小的、响应式的 CSS 模块,能够用于任一 Web 项目”

* 大旨概念:SMACSS, 极简主义.

* 框架谈到: 16 KB

* 预管理器: None

* 响应式: Yes

* 模块化: Yes

* 模板/布局: Yes

* Logo集合: 无,你能够动用 Font Awesome .

* 插件/扩展: None

* 独特组件: None

* 文档: 好

* 定制: 基本的 GUI 皮肤创设器

* 浏览器辅助: Latest versions of Firefox, Chrome, Safari; IE7 ; iOS 6.x, 7.x; Android 4.x

* 许可证:Yahoo! Inc. BSD

UIkit说明

UIkit成功采用在数不完WordPress大旨中。它提供了灵活和有力的手动定制机制(以前版本的框架还提供了高等GUI定制造进度序)。

Notes on UIkit

UIkit已经打响的在无数WordPress 大旨上利用,它提供了一个灵活、强大的定制化学工业机械制,也得以经过GUI定制器举行手动操作。

哪多个框架更契合您?

最终,在选用适宜的框架方面,让本身给您有的见识,这里有一对最首要的事体须要小心:

  • 本条框架有丰硕的名气吗?更加大的遍布意味着更加的多的人踏足这些项目,因而,会有越来越多来自社区的教程和文章,越来越多真实的案例/网址,更加的多第三方扩张,与相关web开垦产品更加好地构成。巨大的名气也象征框架不太会过时,毕竟一个独具巨大群众体育使用的框架是不太大概被放任的。
  • 以此框架还在不断积极开荒吗?一个好的框架是索要整合新型的网络技艺不断提高的,特别是有关移动方面包车型客车工夫。
  • 其一框架已经成熟了吧?假使三个框架尚未在实质上项目和测量检验中使用,那么你能够恣心所欲玩,但依赖它做正经项目就不太明智了。
  • 其一框架提供能够的文书档案吗?特出的文书档案总是能为你的学习进度提供方便人民群众。
  • 其一框架的特异性程度有多高?这里的核心是,比较四个独特程度高的框架,使用贰个更通用的框架要轻巧得多。在非常多动静下,最佳选取叁个小小风格的框架,因为它更易于定制。相比较重写或遮掩现成的条条框框,增加新的CSS准则是更方便和火速的流水生产线。其他,若是您在现存框架的底部增加新准绳,那么你将恐怕会留下一些不被选用的法规,这将净增不须求的CSS文件的分寸。

最后,假诺您依然不显明,能够使用混合着搭配方式。假若一个一定的框架不满意你的急需,您能够从四个或七个以上的品种来勾兑组件。举个例子,你能够从三个框架得到很小的CSS样式基础从另一个框架拿到贰个能够的栅格系统,再从第多个框架获得更复杂的组件。模块化万岁!:)

您的主张是如何吗?那些框架有啥样亮点和症结是此处未有涉及的吧?你感觉还会有任何主题材料是应当被列出来的啊?在上面包车型大巴斟酌中能够让大家意识到。

赞 4 收藏 评论

2.Foundation

Foundation 在这份列表中是第二选举项。该框架有一个真正有力、并且很棒的基本功。其它,有大多大网址在接纳该框架,包涵:推特, Mozilla, Ebay, Yahoo! 以及国家地理杂志等等。

彩世界网址 8

* 所属: ZURB

* 发表时间: 2013

* 当前时刻:6.3.1

* 受款待程度: 在 Github 收获 25,400 个点赞

* 描述: “最高端的响应式前端框架”

* 主旨概念: QashqaiWD, 移动优先,语义化

* 框架体量: 197.5 KB

* 预管理器: Sass

* 响应式: Yes

* 模块化: Yes

* 模板/布局: Yes

* 图标集:Foundation Icon Fonts

* 插件/扩展: Yes

* 独特组件: Icon Bar, Clearing Lightbox, Flex Video, Keystrokes, Joyride, Pricing Tables

* 文书档案: 好,提供数不完极其能源

* 定制: 基本的 GUI 定制器,类似 Bootstrap 那款

* 浏览器协理: Chrome, Firefox, Safari, IE9 ; iOS, Android, Windows Phone 7

* 许可证: MIT

4.Pure

Pure是一种轻量级的模块化框架,采用纯CSS编写,具有可凭仗供给联合利用或单独行使的组件。

创作者:雅虎
发行: 2013
日前版本: 0.6.2

流行度: GitHub上有16,637颗星
注明: “一套小而灵活的CSS模块,能够在每个Web项目中应用。”
主导概念/原则: SMACSS,极简主义。
框架大小: 16 KB
预处理:无
响应式布局:是
模块化:是
开发银行模板/布局:是
Logo集:无。能够改用Font Awesome。
额外/附加组件:无
优异组件:无
文书档案财富:很好
自定义:基本GUI皮肤生成器
浏览器补助:最新版本的Firefox,Chrome,Safari; IE7 ; iOS 6.x,7.x; Android 4.x
许可证: Yahoo! Inc. BSD

4. Pure by Yahoo!

Pure是叁个轻量级的、模块化的框架,以纯CSS编写,它包罗十分的多零部件,你能够依附须要一同或单独运用它们。

彩世界网址 9

  • **创建者:  Yahoo**
  • 发布: 2013
  • 近期版本: 0.5.0
  • 人气: 在Github上有9,900 stars
  • 描述: “您能够在每叁个web项目中选拔的一组小的和响应式的CSS模块”
  • 主导概念/原则:SMACSS,极简的.
  • 框架大小: 18 KB
  • 预管理器:  None
  • 响应式: Yes
  • 模块化: Yes
  • 开始模板/布局: Yes
  • Logo设置: 未有,能够使用Font Awesome代替
  • 附加/插件: None
  • 万分的组件:None
  • 文档: 良好
  • 定制: 基本的GUI定制器。
  • 浏览器协助:Firefox的摩登版本, Chrome, Safari; IE7 ; iOS 6.x, 7.x; Android 4.x
  • 许可证: MIT

1.Bootstrap中文网(Boostrap英文网)

Bootstrap 是最受接待的 HTML、CSS 和 JS 框架,用于支付响应式布局、移动设备优先的 WEB 项目

彩世界网址 10

* 作者:Mark Otto and Jacob Thornton

* 公布时间: 二零一三

* 当前版本: 3.3.7

* 遍布程序: 在 Github 上获取 111,000 个点赞

* 描述: “Bootstrap 是最受接待的 HTML、CSS 和 JavaScript 框架,用于支付响应式、移动优先的 Web 应用”

* 核心概念:安德拉WD 以及移动优先

* 框架体量: 154 KB

* 预管理器:Less and Sass

* 响应式: Yes

* 模块化: Yes

* 帮助模板和布局?: Yes

* 图标集:Glyphicons Halflings set

* 插件/扩张: 未有绑定,然则十分多第三方的能够选用

* 独特的组件: Jumbotron

* 文档: Good

* 定制: 基本的 GUI 定制工具,不行的是你要求手工业输入颜色值,因为从没提供颜色拾取器

* 浏览器帮助: Firefox, Chrome, Safari, IE8 (IE 8 须求 Respond.js )

* 许可证:MIT

Bootstrap说明

Bootstrap的科学普及流行是它的优势所在。在技术上,它不分明比列表中的另外框架越来越好,但它提供了比别的八个框架越来越多的财富(小说和科目、第三方插件和扩充、宗旨营造器等)。简单来讲,Bootstrap 无处不在,那是公众继续选择的首要缘由。

创作者: Mark Otto 和 Jacob Thornton.
发行: 2011
当下版本: 3.3.7
人气: GitHub上有111,000颗星
证实: “Bootstrap是最盛行的HTML,CSS和JavaScript框架,用于在网络上支付响应式、移动的Web项目。
主导概念/原则: CRUISERWD和移动端优先。
框架大小: 154 KB
预处理器: Less和Sass
响应式布局:是
模块化:是
启航航空模型型板/布局:是
图标集: Glyphicons Halflings设置
外加/附属类小部件:无捆绑,大多第三方插件可用。
特别组件: Jumbotron
文书档案能源:卓绝
自定制:基本GUI定制器。不过你须要手动输入颜色值,因为尚未颜色选用器可用。
浏览器辅助: Firefox,Chrome,Safari,IE8 (您须要IE8的Respond.js)
许可证: MIT

5. UIkit by YOOtheme

UIkit 是八个简洁的框架,它轻便使用,易于定制组件。即使它不像其余竞争对手同样受接待,但它提供了同等的效果和材料。

彩世界网址 11

  • 创建者:   YOOtheme
  • 发布: 2013
  • 现阶段版本: 2.13.1
  • 人气: 在Github上有3,800 stars
  • 描述: “三个轻量级的和模块化的前端框架,用于快捷支付和成效庞大的web接口。”
  • 基本概念/原则:ENVISIONWD, 手提式有线电电话机优先.
  • 框架大小:  118 KB
  • 预处理器:  Less, Sass
  • 响应式: Yes
  • 模块化: Yes
  • 开端模板/布局: Yes
  • Logo设置: Font Awesome
  • 附加/插件: Yes
  • 破例的机件: Article, Flex, Cover, HTML Editor
  • 文档: 良好
  • 定制: 优秀的GUI定制器。
  • 浏览器帮忙: Chrome, Firefox, Safari, IE9
  • 许可证: MIT

5.UIkit

UIkit是一个轻巧使用和自定义的零部件的洗练集结。即便它不像任何框架那样受款待,但它提供了同样的成效和质量。

创造者: YOOtheme
发行: 2013
近年来版本: 3.0.0
人气:GitHub GitHub上有9,422颗星
表明: “用于开垦火速而强大的Web界面包车型大巴轻量级和模块化的前端框架”。
基本概念/原则: 翼虎WD,移动端优先
框架大小: 326.9 KB(纵然带有uikit-icons.min.js与SVGLogo相关的功用,则为384.4 KB )
预管理器:少,Sass
响应式布局:是
模块化:是
运转模板/布局:是
Logo集: UIkit自带SVGLogo系统和类库,在那之中满含越多的提纲Logo。
外加/附加组件:是
特种的组件:Article, Flex, Cover, HTML Editor
文件:好
自定义:高等GUI定制程序仅在版本2(以前的版本)中可用
浏览器扶助: Chrome,Firefox,Safari,IE9
许可证:MIT

2. Foundation by ZURB

Foundation是这多少个框架中第二大的,在像ZURB同样实力富饶的铺面扶助下,这几个框架确实很强大,是的,就是foundation。终归, Foundation已经在重重大型网站上投入使用,包蕴 Facebook, Mozilla, Ebay, Yahoo!和江山地理等等。

彩世界网址 12

  • 创建者: ZURB
  • 发布: 2011
  • 眼下版本:5.4.7
  • 人气: 在Github上有18,000 stars
  • 描述: “世界上最优异的响应式前端框架”
  • 主导概念/原则: RWD 、手提式有线电话机优先、语义的
  • 框架大小: 326KB
  • 预管理器: Sass
  • 响应式: Yes
  • 模块化: Yes
  • 始于模板/布局: Yes
  • Logo设置: Foundation Icon Fonts
  • 附加/插件: yes
  • 出奇的零部件: Icon Bar, Clearing Lightbox, Flex Video, Keystrokes, Joyride, Pricing Tables
  • 文档: 特出,还会有为数比非常多格外的能源是可用的。
  • 定制: 未有GUI编辑器,只好手工业定制。
  • 浏览器协助: Chrome, Firefox, Safari, IE9 ; iOS, Android, Windows Phone 7
  • 许可证: MIT

1.Bootstrap

Bootstrap是当前可用框架中不言而喻标公司处理者。其知名度日益增长,你可以放心的抉择那一个框架,而不用担忧项目会失利,因为兼具广阔选拔基础的框架,不太恐怕被屏弃。

1. Bootstrap

Bootstrap 在今日盛行的各个框架中是可信赖的不胜。鉴于其每天仍在滋长的宏大名气,能够一定,那一个美好的工具相对不会令你失望,它也不会在你成功创建网址前就离开到别处。

彩世界网址 13

  • 创建者: Mark Otto and Jacob Thornton.
  • 发布: 2011
  • 如今版本: 3.3.1
  • 最流行的5个前端框架对比彩世界网址。人气: 在Github上有75,000 stars
  • 描述: “Bootstrap是最流行的的 HTML, CSS和 JavaScript 响应式开垦框架 ,web上付出的第2个活动项目.”
  • 基本概念/原则: RWD 和平运动动优先
  • 框架大小: 145 KB
  • 预管理器: Less 和 Sass
  • 响应式: Yes
  • 模块化: Yes
  • 发端模板/布局: Yes
  • 图标设置: Glyphicons Halflings set
  • 附加/插件: 未有捆绑插件,但广大第三方插件可用.
  • 独特的零部件: Jumbotron
  • 文档: 良好
  • 定制: 基本的GUI定制器。不幸的是,你须要手动输入的颜色值,因为尚未可用的水彩选用器。
  • 浏览器帮衬: Firefox, Chrome, Safari, IE8 (你需要 Respond.js for IE8)
  • 许可证: MIT

Notes on Bootstrap

  •  Bootstrap 的要害优点是它足够流行。从能力上讲,它并不一定比此番列出来的另外框架好,但它提供的财富(小说和课程、第三方插件和庞大、大旨开拓者等等)比其他多个框架的总量还要多。一言以蔽之,Bootstrap无处不在。那是人人三翻五次选取它的主要性原因。
  • (注意:“独特的机件”的情趣是,比较这里提到的别的框架是无比的。)

3.Semantic UI

Semantic UI是叁个语义化设计的前端开源框架。它选择自然语言原理,进而使代码特别可读和可领略。

创作者: Jack Lukic
发行: 2013
时下版本: 2.2

人气: GitHub上有34,762颗星
表明: “基于自然语言原则的UI组件框架”。
基本概念/原则:Semantic, tag ambivalence, responsive。
框架大小: 806 KB
预管理器:少
响应式布局:是
模块化:是
开发银行模板/布局:是,并提供了有个别主干的入门模板
图标集: Font Awesome
额外/附加组件:否
万分的预制构件:Divider, Flag, Rail, Reveal, Step, Advertisement, Card, Feed, Item, Statistic, Dimmer, Rating, Shape。
文书档案能源:蛮好,Semantic提供了贰个老大有组织的文书档案,别的还应该有叁个单独的网站提供入门指南、自定义和成立主旨。
自定义:未有GUI定制器,独有手动定制。
浏览器协理: Firefox,Chrome,Safari,IE10 (仅IE9浏览器前缀),Android 4,Blackberry 10
许可证:MIT

3. Semantic UI

Semantic UI 经过经过了不长的时间的努力,致力于能够以更语义化的主意营造网址。它选择自然语言的规格,使代码更可读,更易于掌握。

彩世界网址 14

  • 创建者: Jack Lukic
  • 发布:2013
  • 此时此刻版本:1.2.0
  • 人气: 在Github上有12,900 stars
  • 描述: “基于自然语言有效标准的UI组件框架”
  • 主导概念/原则: 语义,标签的争持性、响应式
  • 框架大小: 552KB
  • 预管理器: Less
  • 响应式: Yes
  • 模块化: Yes
  • 开班模板/布局: No
  • Logo设置: Font Awesome
  • 附加/插件: yes
  • 出奇的零件: Divider, Flag, Rail, Reveal, Step, Advertisement, Card, Feed, Item, Statistic, Dimmer, Rating, Shape.
  • 文档: 相当好。Semantic提供了三个很好的公司文书档案,还会有二个提供入门指南,定制和创办焦点单独的网址,。
  • 定制: 未有GUI定制器,只好手工业定制。
  • 浏览器扶助:Firefox, Chrome, Safari, IE10 (IE9 with browser prefix only), Android 4, 布莱克berry 10
  • 许可证: MIT

2.Foundation

Foundation是排在第二名的框架。ZURB那样抓牢的同盟社直接协助着Foundation,所以那几个框架有无往不胜的基本功。Foundation现已用于多数大型网址,包涵Facebook,Mozilla,Ebay,Yahoo!和国家地理等。

创作者: ZURB
发行: 2011
眼前版本: 6.3.1
人气: GitHub上有25,400颗星
表明: “世界上最早进的响应式前端框架”
主导概念/原则: WranglerWD,移动端优先,语义。
框架大小: 197.5 KB
预管理器: Sass
响应式布局:是
模块化:是
运维模板/布局:是
Logo集: 基础Logo字体
额外/附加组件:是
极度规的零件: Icon Bar, Clearing Lightbox, Flex Video, Keystrokes, Joyride, Pricing Tables
文书档案能源:卓绝,还应该有好些个外加能源。
自定制:基本的GUI定制造进程序,类似于Bootstrap定制工具。
浏览器帮助: Chrome,Firefox,Safari,IE9 ; iOS,Android,Windows Phone 7
许可证:MIT

Ba la la la ~ 读者对象们,你们好啊,又到了冷锋时间,话非常的少说,发车!


本文由时时app平台注册网站发布于web前端,转载请注明出处:最流行的5个前端框架对比彩世界网址

关键词: