① Web前端常用的主流框架汇总
今天小编要跟大家分享的文章是关于Web前端常用的主流框架汇总。本文将带大家大家熟悉前端中的7种框架。在了解框架之前，大家至少要知道前端中的这三个部分：HTML，CSS，JavaScript。
HTML：负责结构，网页想要表达的内容由HTML书写
HTML(超文本标记语言——HyperTextMarkupLanguage)是构成Web
世界的基石。HTML是一种基础技术，常与CSS、JavaScript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面。
CSS:负责样式，网页的美与丑由它来控制
层叠样式表(英文全称：CascadingStyle
Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
JavaScript:负责交互，用户和网页产生的互动由它来控制
一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML(标准通用标记语言下的一个应用)网页上使用，用来给HTML网页增加动态功能。
Web前端发展至今，演变出了无数的库和框架;说到库第一时间想到的是不是jquery?今天我们就来说说前端发展到现在都有哪些好用的库框架，下面来和小编一起看一看吧!
框架一：Vue.js
近几年最火的前端框架当属Vue.js了，Vue.js是一个构建数据驱动的Web界面的渐进式框架。Vue.js的目标是通过尽可能简单的API
实现响应的数据绑定和组合的视图组件。很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。授予了这么高的评价的vue.js，也是开源世界华人的骄傲，因为它的作者是位中国人--尤雨溪。
框架二：Bootstrap
Bootstrap是让你的页面更简洁、直观、强悍、移动设备优先的前端开发框架,让Web开发更迅速、更简单。它还提供了更优雅的HTML和CSS规范，它是由动态CSS语言Less写成。有着丰富的网格布局系统以及丰富的可重用组件，还有强大的支持的JavaScript、jQuery插件以及组件定制等。
框架三：Layui
Layui是一款口碑极佳的Web弹层组件，是一款采用自身模块规范编写的前端UI框架，遵循原生HTML/CSS/JS
的书写与组织形式，门槛极低，拿来即用。Layui首个版本发布于2016年秋，它区别于那些基于MVVM底层的UI框架，从核心代码到API
的每一处细节都经过精心雕琢，非常适合界面的快速开发。
框架四：Element-UI
Element-Ul是饿了么前端团队推出的一款基于Vue.js2.0的桌面端UI框架，手机端有对应框架是MintUI
。适合于Vue的UI框架。
框架五：MintUI
MintUI是由饿了么前端团队推出的一个基于Vue.js的移动端组件库，MintUI包含丰富的CSS和JS
组件，能够满足日常的移动端开发需要。通过它，可以快速构建出风格统一的页面，提升开发效率。
框架六：Angular
AngularJS诞生于2009年,由MiskoHevery
等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是MVW(Model-View-Whatever)、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
框架七：React
React可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时React
也可以高效地更新渲染界面。因为该公司对市场上所有JavaScriptMVC框架，都不满意，就决定自己写一套，用来架设Instagram
的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。
上面就是比较常用的7种Web前端主流框架，相信每个前端工程师都有接触过这几种库框架中的几种。
框架是一种约束，也是一种最佳实践。让你在团队开发中，不能怎么写，必须怎么写，推荐怎么写。而库是一种代码复用的方式，把某些代码段、函数、功能封装起来，你可以开箱即用。学会几种库框架，复杂的前端也会变得简单。
所以库框架的学习在前端中显得尤为重要，甚至决定你是否能拿到一个高薪水的工作。
以上就是小编今天为大家分享的关于Web前端常用的主流框架汇总的文章，希望本篇文章能够对正在从事web前端知识的小伙伴们有所帮助，想要了解更多web前端知识记得关注北大青鸟web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的web前端工程师。
② web前端常用的框架有哪些
现在比较常用的主流框架有Vue、React、Angular。
Angular
Angular原名angularJS诞生于2009年，之前我们都是用jquery开发，自从angular的出现让我们有了新的选择，它最大的特点是把后端的一些开发模式移植到前端来实现，如MVC、依赖注入等，创新式的双向数据绑定不知简化了我们多少代码，让我们为之疯狂，特别是表单处理方面，从此名声大噪。
好的框架一般会有两个结果，一个继续不断更新迭代，避免被拍死在沙滩上，一个是被一些大公司收购焕发第二春，angular属于后者被google所收购，且从2.0后改名angular并使用微软的typescript作为开发语言，目前最新版本8.0，照说傍上google与微软这两条大船，前途应该不可限量才对，然而造化弄人，现在angular的市场份额已经被React这个后起之秀和Vue这颗新星远远地甩到脑后。
React
React，facebook出品，正式版推出是在2013年，比angular晚了4年，但得益于其创新式的VirtualDOM，性能上碾压angularJS，一经推出，火的一塌糊涂。 特点很多，VirtualDOM、JSX、Diff算法等，支持ES6语法，采用函数式编程，门槛稍高，但也更灵活，能让开发具有更多可能性。
Vue
Vue作为最后推出的框架（2014年），借鉴了前辈angular和react的特点（如VirtualDOM、双向数据绑定、diff算法、响应式属性、组件化开发等）并做了相关优化，使其使用起来更加方便，更容易上手，比较少适合初学者。网上有很多人说Vue不适合做大型项目，纯属扯淡，Vue在这方面已经优化得很好，当然，大量的响应式属性（监听属性）也许会用一定的性能损耗，但在硬件、网络大力发展的今天，这些细微的性能差异几乎感觉不到。
③ 前端常用的框架有哪些
给你介绍Web前端三大主流框架
React：
1.声明式设计：React采用声明范式，可以轻松描述应用。
2.高效：React通过对DOM的模拟，最大限度地减少与DOM的交互。
3.灵活：React可以与已知的库或框架很好地配合。
优点：
1.速度快：在UI渲染过程中，React通过在虚拟DOM中的微操作来实现对实际DOM的局部更新。
2.跨浏览器兼容：虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。
3.模块化：为你程序编写独立的模块化UI组件，这样当某个或某些组件出现问题是，可以方便地进行隔离。
4.单向数据流：Flux是一个用于在JavaScript应用中创建单向数据层的架构5.同构、纯粹的javascript：因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行，预渲染你的应用有助于搜索引擎优化。6.兼容性好：比如使用RequireJS来加载和打包，而Browserify和Webpack适用于构建大型应用。它们使得那些艰难的任务不再让人望而生畏。缺点：React本身只是一个V而已，并不是一个完整的框架，所以如果是大型项目想要一套完整的框架的话，基本都需要加上ReactRouter和Flux才能写大型应用。
Vue：
Vue是尤雨溪编写的一个构建数据驱动的Web界面的库，准确来说不是一个框架，它聚焦在V（view）视图层。
它有以下的特性：
1.轻量级的框架
2.双向数据绑定
3.指令
4.插件化
优点：
1.简单：官方文档很清晰，比Angular简单易学。
2.快速：异步批处理方式更新DOM。
3.组合：用解耦的、可复用的组件组合你的应用程序。
4.紧凑：~18kbmin+gzip，且无依赖。
5.强大：表达式无需声明依赖的可推导属性(computedproperties)。
6.对模块友好：可以通过NPM、Bower或Duo安装，不强迫你所有的代码都遵循Angular的各种规定，使用场景更加灵活。
缺点：
1.新生儿：Vue.js是一个新的项目，没有angular那么成熟。
2.影响度不是很大：google了一下，有关于Vue.js多样性或者说丰富性少于其他一些有名的库。
3.不支持IE8。
Angular：
Angular是一款优秀的前端JS框架，已经被用于Google的多款产品当中。
它有以下的特性：
1.良好的应用程序结构
2.双向数据绑定
3.指令
4.HTML模板
5.可嵌入、注入和测试
优点：
1.模板功能强大丰富，自带了极其丰富的angular指令。
2.是一个比较完善的前端框架，包含服务，模板，数据双向绑定，模块化，路由，过滤器，依赖注入等所有功能；3.自定义指令，自定义指令后可以在项目中多次使用。
4.ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助。
5.angularjs是互联网巨人谷歌开发，这也意味着他有一个坚实的基础和社区支持。
缺点：
1.angular入门很容易但深入后概念很多,学习中较难理解。
2.文档例子非常少,官方的文档基本只写了api,一个例子都没有,很多时候具体怎么用都是google来的,或直接问misko,angular的作者。
3.对IE6/7兼容不算特别好,就是可以用jQuery自己手写代码解决一些。
4.指令的应用的最佳实践教程少,angular其实很灵活,如果不看一些作者的使用原则,很容易写出四不像的代码,例如js中还是像jQuery的思想有很多dom操作。
5.DI依赖注入如果代码压缩需要显示声明。
④ 前端框架哪个好
现在流行的Web前端框架有哪些？
React：它最大优势在于它们相对简单和专注。做一件事情并把它做好是非常困难的，但这个库很有效地完成了它的目标。虽然对于某些状态容器方法可能是外部的，但大多数开发人员还是可以轻松掌握概念，并了解单向数据体系结构的好处，简化大量的用户界面应用程序
Angular：对于用户来说它有一套用于构建用户界面的丰富组件，这也是本系列中少有的几个框架能够做到这点。
Vue：渐进式构建能力是vue.js最大的优势，vue有一个简洁而且合理的架构，使得它易于理解和构建。
vue有一个强大的充满激情人群的社区，这为vue.js增加了巨大的价值，使得为一个空白项目创建一个综合的解决方案变得十分容易。
⑤ 前端常用的框架有哪些
前端三大框架，是Angular、React、Vue，这三个框架现在是最为流行也是最多人用的框架。
React：
1.声明式设计：React采用声明范式，可以轻松描述应用。
2.高效：React通过对DOM的模拟，最大限度地减少与DOM的交互。
3.灵活：React可以与已知的库或框架很好地配合。
优点：
1.速度快：在UI渲染过程中，React通过在虚拟DOM中的微操作来实现对实际DOM的局部更新。
2.跨浏览器兼容：虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。
3.模块化：为你程序编写独立的模块化UI组件，这样当某个或某些组件出现问题是，可以方便地进行隔离。
4.单向数据流：Flux是一个用于在JavaScript应用中创建单向数据层的架构5.同构、纯粹的javascript：因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行，预渲染你的应用有助于搜索引擎优化。6.兼容性好：比如使用RequireJS来加载和打包，而Browserify和Webpack适用于构建大型应用。它们使得那些艰难的任务不再让人望而生畏。缺点：React本身只是一个V而已，并不是一个完整的框架，所以如果是大型项目想要一套完整的框架的话，基本都需要加上ReactRouter和Flux才能写大型应用。
Vue：
Vue是尤雨溪编写的一个构建数据驱动的Web界面的库，准确来说不是一个框架，它聚焦在V（view）视图层。
它有以下的特性：
1.轻量级的框架
2.双向数据绑定
3.指令
4.插件化
优点：
1.简单：官方文档很清晰，比Angular简单易学。
2.快速：异步批处理方式更新DOM。
3.组合：用解耦的、可复用的组件组合你的应用程序。
4.紧凑：~18kbmin+gzip，且无依赖。
5.强大：表达式无需声明依赖的可推导属性(computedproperties)。
6.对模块友好：可以通过NPM、Bower或Duo安装，不强迫你所有的代码都遵循Angular的各种规定，使用场景更加灵活。
缺点：
1.新生儿：Vue.js是一个新的项目，没有angular那么成熟。
2.影响度不是很大：google了一下，有关于Vue.js多样性或者说丰富性少于其他一些有名的库。
3.不支持IE8。
Angular：
Angular是一款优秀的前端JS框架，已经被用于Google的多款产品当中。
它有以下的特性：
1.良好的应用程序结构
2.双向数据绑定
3.指令
4.HTML模板
5.可嵌入、注入和测试
优点：
1.模板功能强大丰富，自带了极其丰富的angular指令。
2.是一个比较完善的前端框架，包含服务，模板，数据双向绑定，模块化，路由，过滤器，依赖注入等所有功能；3.自定义指令，自定义指令后可以在项目中多次使用。
4.ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助。
5.angularjs是互联网巨人谷歌开发，这也意味着他有一个坚实的基础和社区支持。
缺点：
1.angular入门很容易但深入后概念很多,学习中较难理解。
2.文档例子非常少,官方的文档基本只写了api,一个例子都没有,很多时候具体怎么用都是google来的,或直接问misko,angular的作者。
3.对IE6/7兼容不算特别好,就是可以用jQuery自己手写代码解决一些。
4.指令的应用的最佳实践教程少,angular其实很灵活,如果不看一些作者的使用原则,很容易写出四不像的代码,例如js中还是像jQuery的思想有很多dom操作。
5.DI依赖注入如果代码压缩需要显示声明。
⑥ 前端常用的框架有哪些
给大家介绍几个在Web前端界比较优秀的前端框架。
1、Bootstrap
Twitter出品的Bootstrap在业界是非常受欢迎的，以致于有很多前端框架都在其基础上开发，如我们熟悉的WeX5就是在Bootstrap源码基础上优化而来的。我相信大多数接触过前端开发的同学多少都了解过这个优秀的前端框架。Bootstrap是基于HTML、CSS和Javascript的，它简洁灵活，可以使得Web开发更加敏捷。
它提供优雅的HTML和CSS规范，在jQuery的基础上进行更加个性化和人性化的完善。兼容大部分jQuery插件，并包含了丰富的Web组件，如下拉菜单、按钮式下拉菜单、导航条、按钮组、分页、缩略图、进度条和媒体对象等。自带了13个jQuery插件，其中有模式对话框、标签页、滚动条和弹出框等。
2、Foundation框架
Foundation框架总体来看要比Bootstrap略显高大上一点，但他们俩的设计理念都是非常清楚的，Bootstrap有引导的意思，它尝试处理你项目中的一切所需。Foundation有基础、地基及支柱的意思，给你项目中强有力的创造与支持。相对于Bootstrap丰富的组件及插件，Foundation仅提供了有限的几种元素，其目标是，即使你使用预定义的UI元素，也不应该与大家的网站长得太像。
而Bootstrap则致力于提供所有定义好的元素，这样使得看起来许多网站都差不多。Foundation默认不带图标集，它推荐使用开源字体图标。与Bootstrap一样，Foundation使用网格流式布局将网页划分为12列，针对不同的设备显示不同的列数，实现响应式布局。但Foundation不支持旧版本浏览器。其他特性如有兴趣可进一步了解。
3、Curl
Curl 是一个命令行工具，用于通过 HTTP(s)、FTP 和数十种其它协议进行请求。使用Curl可以进行文件下载、检查响应标题和自由访问远程数据。
在 Web 开发中，Curl 经常和 RESTful API 一起使用，用于测试连接。
# Fetch the headers of a URL.curl -I http://google.comHTTP/1.1 302 FoundCache-Control: privateContent-Type: text/html; charset=UTF-8Referrer-Policy: no-referrerLocation: http://www.google.com/?gfe_rd=cr&ei=0fCKWe6HCZTd8AfCoIWYBQContent-Length: 258Date: Wed, 09 Aug 2017 11:24:01 GMT# Make a GET request to a remote API.curl http://numbersapi.com/random/trivia29 is the number of days it takes Saturn to orbit the Sun.
Curl 命令可能比上述代码更复杂。有许多选项用于控制 headers、Cookie、身份验证等。了解更多，请阅读Everything curl。
4、Tree
Tree 是一个小型的命令行实用程序，它将目录中的文件以可视化的方式进行显示。它采用递归运行的方式，遍历每个级别的嵌套并绘制所有内容的格式树。这样就能快速的浏览并查找需要的文件。
tree.├── css│ ├── bootstrap.css│ ├── bootstrap.min.css├── fonts│ ├── glyphicons-halflings-regular.eot│ ├── glyphicons-halflings-regular.svg│ ├── glyphicons-halflings-regular.ttf│ ├── glyphicons-halflings-regular.woff│ └── glyphicons-halflings-regular.woff2└── js ├── bootstrap.js └── bootstrap.min.js
还可以使用简单的 regEx 模式来过滤结果：
tree -P '*.min.*'.├── css│ ├── bootstrap.min.css├── fonts└── js └── bootstrap.min.js
5、Tmux
根据维基的解释，Tmux 是一个终端复用器。通俗的说，它是一个能将多个终端连接到单个终端会话的工具。
Tmux允许用户在终端中的程序之间切换，添加屏幕窗格，并将多个终端连接到同一个会话，使其保持同步。在远程服务器上工作时，Tmux 特别有用，因为它允许用户创建新的选项卡，而无需再次登录。
6、
命令用于生成关于文件和目录的空间使用情况的报告。很容易使用，可以递归地运行，遍历每个子目录并返回每个文件的大小。
的常见用例是：当某个驱动器的空间不足，用户不清楚每个存储器的大小。使用此命令可以快速查看每个文件夹所占用的存储空间，从而找到占用最大空间的存储器。
7、AUI
AUI是最近流行起来的，作者声称是专为APIClound设计的一套框架，解决了许多移动端开发实际中遇到的许多问题，是一个纯CSS框架。使用容器+布局+模块的构建方式，JS辅助，更自由更灵活更易于扩展使用。遵循Google Material设计规范，完美适配各个机型。面向HTML5，使用CSS3实现动画交互，轻量级高性能。AUI是使用MIT License授权，你可以复制、出售。目前最新版本2.0。
8、Amaze UI
这是称为妹子UI的开源框架，据称是中国首个开源HTML5跨屏前端框架。妹子UI以移动优先为理念，从小屏逐渐到大屏，实现响应式网页。Amaze UI包含20+个CSS组件、20+个JS组件，更有多个包含不同主题的Web组件。相比国外框架，妹子UI关注中文排版提供本地化支持。面向HTML5开发，使用CSS3来实现动画交互，轻量级高性能。
9、Frozen UI
Frozen UI是一款开源，简单易用，轻量敏捷的移动端框架。基于手Q样式规范，目前全面应用于企鹅手Q增值业务中。基础样式效果简单色调清爽，社区活跃，组件自然不少。包括按钮、列表、表单、通知、提示条、弹出框、选项卡等等常用组件。还包括一个FrozenJs的JS组件库。可以在主流的Android和IOS上应用。基本样式使用离线包的方式减少请求提供快速接入方案。当然，根据网友反映，也存在大大小小的bug。不过总体来说，还是值得一用的。奇怪的是，Github上显示的最后更新时间是一年前，难道已经没人维护了吗？
# Running this will show the space usage of each folder in the current directory.# The -h option makes the report easier to read.# -s prevents recursiveness and shows the total size of a folder.# The star wildcard (*) will run on each file/folder in current directory. -sh *1.2G Desktop4.0K Documents40G Downloads4.0K Music4.9M Pictures844K Public4.0K Templates6.9M Videos
还有一个相似的命令 df（Disk Free），使用df会返回有关可用磁盘空间的各种信息。
以上介绍了现在热门的几个Web前端框架，以及它们的主要功能，希望对大家学习Web前端有所帮助。
⑦ 8个提高工作效率的Web前端开发框架总结
今天小编要跟大家分享的文章是关于8个提高工作效率的Web前端开发框架总结。着互联网的推进我们可以寻找到各种高效资源，比如我们设计网站、小程序和公众号开发的时候，前端设计并不需要我们太多的自主设计，我们可以借助免费开源或者有些付费的前端框架和插件来快速完成。比如我们在设计网站主题的时候，可以借助类似BootStrap、Layui这些常用的前端框架高效开发。
目前可选的前端框架还是比较多的，有些以前出名的如今已经逐渐淡出我们的视野，包括笔者以前也有用过的Amaze
UI，我也准备在这篇文章中分享的但是官方网站好像无法打开SSL失效，估计可能没有人维护。我们真的要去整理前端框架UI的话，大大小小十几个肯定是有的，但是我们一般也用不了这么多，熟悉这么1-2款足矣。下面来和小编一起看一看吧!
第一、Bootstrap
Bootstrap，来自推特官方提供的一个用于前端开发的开源工具包。由他们的设计师MarkOtto和Jacob
Thornton合作开发,是一个CSS/HTML框架。目前广泛被用于我们很多网站、移动端、自适应WEB项目中，应该是目前使用最多的前端框架之一。
第二、Layui
Layui，是一款采用自身模块规范编写的前端UI框架，遵循原生HTML/CSS/JS
的书写与组织形式，门槛极低，拿来即用。这个前端我也有简单接触过，在行业中用户也在慢慢变多，相对BS框架更加精炼一些。
第三、EasyUI
easyui，是一种基于jQuery、Angular.、Vue和React的用户界面插件集合。easyui为创建现代化，互动，JavaScript应用程序，提供必要的功能。easyui是个完美支持HTML5网页的完整框架。居然还分商业和免费版本，如果我们介意的话那就不要选择。
第四、jQueryUI
jQueryUI，是在jQuery
JavaScript库之上构建的一组精选的用户界面交互，效果，小部件和主题。无论是构建高度交互的Web应用程序，还是只需要向表单控件添加日期选择器，jQuery
UI都是理想选择。
第五、YDUITouch
YDUITouch，一个专注移动端、微信的UI框架。YDUITouch
专为移动端打造，在技术实现、交互设计上兼容主流移动设备，保证代码轻、性能高。使用Flex技术，灵活自如地对齐、收缩、扩展元素，轻松搞定移动页面布局。
第六、H-ui
H-ui，基于
HTML、CSS、JAVASCRIPT开发的轻量级Web前端框架。H-ui在bootstrap基础上，吸取众家框架之长，融合开发者自己的思想，进行深度开发，提炼出一套适合中国开发者的HTML和CSS规范。开源免费，简单灵活，兼容性好。
第七、AUI
AUI使用MIT开源协议发布，永久免费。会不定时更新版本及发布模板示例。致力于为开发者提供更好的框架。
第八、NEC
NEC，来自网易的前端框架。NEC包括了规范、框架、代码库、插件等内容,致力于为前端开发人员提供高效率高质量的前端页面开发解决方案,提高多人协作效率。
总结，以上小编我整理出来目前网络上比较常用的前端框架UI，有些是适合移动端开发的，有些是PC端自适应移动端的，总之我们根据实际的习惯和喜欢选择，建议是选择大众的且有在维护更替的，有些小众的说不定哪天就不更新。
以上就是小编今天为大家分享的关于8个提高工作效率的Web前端开发框架总结的文章，希望本篇文章能够对正在从事Web前端工作的小伙伴们有所帮助，想要了解更多Web前端知识记得关注北大青鸟Web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的Web前端工程师。
⑧ CSS框架 ui 有哪些
精致的 CSS UI 框架：
1、Bootstrap – 最流行的Web前端UI框架
2、jQuery UI - 基于jQuery的开源Javascript框架
3、jQuery UI Bootstrap
4、BootMetro - Metro风格的CSS框架
5、Flat UI - 扁平风格 UI 工具包
6、网易CSS框架 NEC
7、Alloy UI – 功能强大的CSS UI框架
8、Cardinal – 移动端的CSS UI框架
9、快速开发CSS的框架 CSScaffold
10、后台UI开发框架 MuseUI
⑨ Web前端开发人员要知道的css框架汇总
今天小编要跟大家分享的文章是关于Web前端开发人员要知道的css框架汇总。对于UI/
UX设计人员而言，要制作一个在每个浏览器上都看起来不错的漂亮网站不是一件容易的事。在创建网站布局并使其美观时，开发人员必须考虑所有Web浏览器和移动视图。
恐惧始终存在于内部，如果设计在某个愚蠢的浏览器上某个地方可怕地崩溃，该怎么办!多亏了
CSS使开发人员的生活变得无限轻松的框架。CSS框架消除了大部分麻烦，如今，开发人员无法想象没有CSS框架的代码。这些框架不仅节省了大量时间，而且还有助于以更好，更快的方式构建漂亮的响应式Web应用程序。
这些框架提供了基本结构，包括网格，交互式UI模式，Web排版，工具提示，按钮，表单元素，图标。提供了现成的解决方案，这有助于快速构建网站。您不需要从头开始，也可以重用项目中的代码。
现在有一个问题，哪个框架最适合您?如果您不熟悉前端开发，那么选择框架可能会有些棘手。老实说，每个CSS框架都有其优缺点，因此，这取决于您的特定需求。在本文中，我们将讨论一些适用于大多数行业开发人员的流行CSS框架。我们在过滤这些框架时会牢记它们的优缺点。下面来和小编一起看一看吧!
1、Bootstrap
地址：#/您可能肯定已经听说过此框架，即使这是您的第一个工作。该框架是第一个推广“智能手机优先”理念的框架。Bootstrap是世界上最流行的CSS框架，它于2011年由Twitter引入。Bootstrap在大规模构建响应式设计方面有很大帮助。当包含相关的引导程序类时，它将自动针对不同的屏幕尺寸调整设计。它提供了大量的插件和主题生成器。该框架的当前版本是Bootstrap
4，其中包括一些其他功能，例如新的配色方案，新的修改器，新的实用程序类。版本4是使用SASS构建的，这意味着Bootstrap现在已经支持LESS和SASS。
优点：
·快速成型
·大型生态系统
·大量的组件
·LESS和SASS支持
·简单的文档和较低的学习曲线
·由Twitter开发，因此对社区有长期的长期信任。
2、Foundation
地址：#/开发人员说，如果编程是一种宗教，那么基金会和Bootstrap的家伙将处于障碍的两边。Foundation是世界上另一个使用最广泛的一流CSS框架。许多公司(例如Facebook，eBay，Mozilla，Adobe甚至Disney)都使用它。该框架是基于Saas(如引导程序)构建的。它更加复杂，灵活并且易于定制。它也带有CLI，因此很容易与模块捆绑器一起使用。它提供了Fastclick.js工具，可在移动设备上更快地呈现。
优点：
·创建响应式设计
·强大的电子邮件框架
·极高的灵活性
·在线网络研讨会培训支持。
·易于定制。
·提供了完整的模块化工具集，可让您解决几乎所有的界面任务
·UI组件及更多：先进的成像系统，定价表组件，表单验证，垂直时间轴布局，RTL支持等等。
3、Bulma
地址：#/与其他CSS框架相比，Bulma是市场上相对较新的框架，但Bulma设法在短时间内获得了用户的很多关注。这个免费的开源CSS框架基于Flexbox布局模型。最好的事情是，它完全基于CSS，根本不需要javascript。全球有200,000多名开发人员在使用它。它反应灵敏，轻巧，并且遵循“移动优先”的方法。
优点：
·所有CSS类名称均按逻辑命名，因此易于学习和记住语法。
·纯CSS，无JavaScript
·大社区
·模块化：使用Saas构建，您可以通过仅导入所需的必要功能来设计界面。
·大量组件，例如垂直对齐解决方案，布局以及媒体对象
4、Pure
地址：#/由Yahoo开发的Pure是一个轻量级的响应CSS框架。它使用Normalize.css构建，可帮助使用网格和菜单创建响应式布局。可以将其分为不同的CSS模块，并且可以根据您的需求和偏好导入这些模块。因此，如果仅需要网格系统，则无需导入整个CSS并增加站点的加载时间。与Bootstrap不同，它不允许创建固定的布局。
优点：
·移动友好
·完全基于CSS，因此很容易学习。
·它提供5点，2点，24点等的变化。因此，在创建网格和列系统时可以更加灵活地使用它。
5、SemanticUI
地址：#/该框架以其令人难以置信的主题效果以及简单优雅的设计而闻名。语义UI是使用人类友好的HTML的响应框架，它允许您创建一个独特而美观的网站，而无需进行多次更改。它提供3000多个主题变量和50多个UI组件。它还支持第三方库，如React，Meteor，Ember，React等。
优点：
·友好的类名：它使用人类友好的HTML，因此可以使用自然语言进行编码。
·与Bootstrap4和其他框架相比更具吸引力的布局。
·仅加载必要的组件，从而减少了下载时间和文件大小
·广泛的组件
6、TailwindCSS
地址：#/Tailwind
CSS是一个灵活且高度可定制的低级CSS框架。Tailwind用PostCSS编写并用JavaScript配置。您将使用低级实用程序类来自定义设计，而不是使用预先构建的组件，从而使您可以完全控制网站的最终制作方式。从正面尺寸到间距，从断点到阴影，从颜色到边框尺寸都可以自定义。例如，您可以为按钮赋予药丸，轮廓和3D外观。您可以个性化每个方面，并且可以以独特的样式创建设计，该样式看起来绝对不同于其他框架，例如Bootstrap或UI套件。
优点：
·易于定制
·实用程序类
·带有响应式选项
7、UIkit
地址：#/这个强大的CSS框架以极简主义功能而闻名。UI
Kit是一个轻量级的最小CSS框架，几乎包含其他框架的所有功能。您可以使用最大的空白空间和许多UI组件(例如SVG图标，进度条，图像制作器等)来创建超干净，优雅且美观的Web界面。有许多令人难以置信的组件，统一的样式和自定义选项。您可以使用Nestable之类的组件创建高级界面。它使用可靠且无冲突的命名约定。您还可以使用纯HTML设计复杂的基于flexbox的布局。
优点：
·极简主义
·大量有用的UI组件集合。
·与更少和更少兼容
·包含JavaScript
·对任何设备的适应性
8、MaterializeCSS
地址：#/如果您喜欢使用材料设计，那么您绝对应该检查一下这个框架。它由Google于2014年创建，该框架对于想要设计网站或Android
Web应用程序的人来说是一个很好的解决方案。许多Google产品都在此框架上实现，例如YouTube，Gmail，Google云端硬盘和Google文档。它带有一些现成的组件和类，使您无需花费太多精力就可以尽快完成工作。该框架使用由Bootstrap建立的基于12列网格的布局，响应性动画和过渡，填充以及诸如灯光和阴影之类的深度效果。使用其预建的入门模板，您可以以最少的设置时间来设计网站。
优点：
·材料设计
·引导网格
·大量的组件选择
·轻松定制
·与Sass兼容
9、Skeleton
地址：#/顾名思义，Skeleton是最简单，响应最少的CSS框架。它仅包含400行代码，但是提供了在项目中使用的多种选择。诸如网格，版式，按钮，表单，列表，媒体查询，表格等功能使您可以轻松创建复杂的网站。我们已经在CSS框架中提到了它，但是更少的代码行没有将自身定义为CSS框架，库甚至模块。它实际上是一个样板，对小型项目或作为UI
/UX开发人员开始其职业的人都非常有用。它仅带有有限数量的标准HTML元素，但这足以开始使用简单而优雅的网站。优点：
·移动友好
·简单易学
10、Miligram
地址：#/顾名思义，这是另一个轻量级CSS框架，旨在更快地创建网站。框架的大小仅为2Kb，但它具有许多功能和Web开发工具来满足您的需求。它为开发人员提供了灵活性，并允许他们使用CSS3规范提供的所有功能。您还可以使用几行自定义CSS进行扩展。
优点：
·基于Flexbox网格
·超级设计主题
我们已经提到了一些CSS框架，这些框架在开发人员中非常流行，但是您也可以尝试其他一些CSS框架。其他一些流行的框架包括Susy，Animate.css，Paper
CSS，NES.css，Base，TentCSS，SimpleGrid，Spectre，MustardUI，Picnic
CSS，Mini.css，Gumby等。
以上就是小编今天为大家分享的关于Web前端开发人员要知道的css框架汇总的文章，希望本篇文章能够对正在从事web前端相关工作的小伙伴们有所帮助，想要了解更多web前端相关知识记得关注北大青鸟web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的web前端工程师。
英文|#/10-best-css-frameworks-for-frontend-developers-in-2020/?ref=rp翻译|web前端开发(ID：web_qdkf)
⑩ 前端常用的框架有哪些
jQuery，Vue，Bootstrap，react。