前端框架之bootstrap框架基本介绍及常用UI框架
前端框架之:bootstrap框架基本使用
下载地址:
https://v3.bootcss.com/getting-started/
Bootstrap框架版本:
2.x 3.x 4.x // 推荐使用3.x版本 相对稳定成熟
本质:使用框架调整页面样式其实就是操作标签的class属性
补充:
bootstrap需要依赖于jQuery才能正常执行(动态效果)
压缩后文件解释:
本地导入bootstrap框架方式(本地无需网络):
外部CDN导入bootstrap框架方式(基于网络):
该网站提供了非常多的样式,可以参考的一个一个的样式(CV)试一下,看一看效果.
基本样式的使用:
组件样式的使用:
Font Awesome样式:
http://www.fontawesome.com.cn/
Font AwesomeCDN:
https://www.bootcdn.cn/font-awesome/
此网站专门提供体表库,完美兼容了bootstrap
复制bootstrap实例:
查看效果:
其他框架:
Element:https://element.eleme.io/#/zh-CN/component/layout
二、前端常用UI框架
1.Pure
- 地址:http://purecss.org/layouts/
- 描述:Pure精心设计,只为可以在任何Web项目中使用。为了例证这一点,我们制作了如下几个模板。这些模板都是响应式的,并且没有使用任何JavaScript。
- 用途:真的是很精美的一个样式框架,便于我们快事构建一些个人产品,当然也可以服务于工作中的一些项目。
2.bootstrap
- 地址:http://www.bootcss.com/
- 描述:简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。
3.EasyUI
- 地址:http://www.jeasyui.net/ (中文网)
- 描述:easyui是一种基于jQuery的用户界面插件集合。
easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。
使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。
easyui是个完美支持HTML5网页的完整框架。
easyui节省您网页开发的时间和规模。
easyui很简单但功能强大的。
4.Ant Design
- 地址:http://ant.design/
- 描述:一个 UI 设计语言,一套提炼和应用于企业级后台产品的交互语言和视觉体系
5. Layui
layer是一款口碑极佳的web弹层组件,是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用。layui 首个版本发布于2016年秋,她区别于那些基于 MVVM 底层的 UI 框架,从核心代码到 API 的每一处细节都经过精心雕琢,非常适合界面的快速开发。
Layui官网地址:https://www.layui.com/
6.ElementUI
Element-Ul是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是Mint UI 。适合于Vue的UI框架;
官网地址:http://element-cn.eleme.io/#/zh-CN
7.Mint UI
Mint UI 是 由饿了么前端团队推出的 一个基于 Vue.js 的移动端组件库,Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要。通过它,可以快速构建出风格统一的页面,提升开发效率。
官网地址:http://mint-ui.github.io/
8.angular
AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是MVW(Model-View-Whatever)、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
官网地址:http://www.angularjs.net.cn/
9.React
React 可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时 React 也可以高效地更新渲染界面。React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设Instagram 的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。
官网地址:http://react-china.org/
10.vue.js
近几年最火的前端框架当属Vue.js了,Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。很多使用过vue的程序员这样评价它,“vue.js兼具angular.js和react.js的优点,并剔除了它们的缺点”。授予了这么高的评价的vue.js,也是开源世界华人的骄傲,因为它的作者是位中国人–尤雨溪
几款常用的高质量web前端框架
Web前端框架就是为了节约开发成本和时间,一般开发一个项目都会用到前端框架(除非自己有前端开发团队),根据我经验找的几款web前端框架做出了分析。都是个人意见,仁者见仁智者见智。