1. 程式人生 > 程式設計 >12個常用前端UI框架集合彙總

12個常用前端UI框架集合彙總

1、bootstrap

Bootstrap 是Twitter推出的一個用於前端開發的,一個用於 HTML、CSS 和 JS 開發的開源工具包,是全球最受歡迎的前端元件庫,用於開發響應式佈局、移動裝置優先的 WEB 專案。

官網:https://v4.bootcss.com/

文件:https://v4.bootcss.com/docs/getting-started/introduction/

12個常用前端UI框架集合彙總

2、Layui

layui(諧音:類UI) 是一款採用自身模組規範編寫的前端 UI 框架,遵循原生 HTML/CSS/JS 的書寫與組織形式,門檻極低,拿來即用。其外在極簡,體積輕盈,元件豐盈,非常適合介面的快速開發。layui 相容人類正在使用的全部瀏覽器(IE6/7除外),可作為 PC 端後臺系統與前臺介面的速成開發方案。

官網:https://www.layui.com/

例子:https://www.layui.com/admin/std/dist/views/

12個常用前端UI框架集合彙總

3、MuseUI

Muse UI 基於 Vue2.0 開發,一套 Material Design 風格開源元件庫,旨在快速搭建頁面,擁有40多個UI 元件,提供了自定義主題,充分滿足可定製化的需求。

官網:https://muse-ui.org/

例子:https://muse-ui.org/#/zh-CN/

12個常用前端UI框架集合彙總

4、View UI

即原先的 iView,是一套基於 Vue.js 的開源 UI 元件庫,主要服務於 PC 介面的中後臺產品。特點:豐富的元件和功能,滿足絕大部分網站場景;提供開箱即用的 Admin 系統 和 高階元件庫;提供專業、優質的一對一技術支援;細緻、漂亮的 UI,可自定義主題。

官網:https://www.iviewui.com/

例子:https://www.iviewui.com/docs/introduce

12個常用前端UI框架集合彙總

5、jQueryUI

jQuery UI是在jQuery JavaScript庫之上構建的一組精選的使用者介面互動,效果,小部件和主題。無論是構建高度互動的Web應用程式,還是隻需要向表單控制元件新增日期選擇器,jQuery UI都是理想的選擇。

官網:https://jqueryui.com/

例子:https://jqueryui.com/demos/

12個常用前端UI框架集合彙總

6、EasyUI

EasyUI是一種基於jQuery、Angular.、Vue和React的使用者介面外掛集合。

jQuery EasyUI 提供易於使用的元件,它使 Web 開發人員能快速地在流行的 jQuery 核心和 HTML5 上建立程式頁面。

EasyUI for Angular是基於原生的Angular 5之上構建的,不需要其他外部JavaScript庫。

官網:http://www.jeasyui.net/

例子:http://www.jeasyui.net/demo/380.html

12個常用前端UI框架集合彙總

7、QuicK UI

QuicK UI 4.0 的元件庫包含了一百多種元件,一千多個應用場景示例,囊括了web開發的各種應用場景。元件的使用也都非常簡單,能讓你的開發效率提高N倍。

官網:http://www.uileader.com/product_quickui.html

例子:http://www.uileader.com/quickui/system/main/main.jsp

12個常用前端UI框架集合彙總

8、Element Ui

Element,一套為開發者、設計師和產品經理準備的基於 Vue 2.0的桌面端元件庫。

官網:https://element.eleme.cn/#/zh-CN/

例子:https://element.eleme.cn/#/zh-CN/component/installation

12個常用前端UI框架集合彙總

9、At-UI

at-ui 是一個模組化的前端 UI 框架,開發基於Vue.js 的快速和強大的 Web 介面。專門為桌面應用程式構建,AT-UI提供了一套 npm + webpack + babel 前端開發工作流程。它提供了一個體面的乾淨整潔的 UI 元件。主要用於快速開發 PC 網站中後臺產品。

官網:https://at-ui.github.io/at-ui/#/zh

例子:https://at-ui.github.io/at-ui/#/zh/docs/introduction

12個常用前端UI框架集合彙總

10、antd

antd 是基於 Ant Design 設計體系的 React UI 元件庫,主要用於研發企業級中後臺產品。開箱即用的高質量 React 元件,全鏈路開發和設計工具體系,數十個國際化語言支援。

官網:https://ant.design/index-cn

例子:https://ant.design/docs/react/introduce-cn

12個常用前端UI框架集合彙總

11、Material-UI

Material-UI是基於React 的UI框架,更快速、更簡便的 web 開發。官方市場中的高階主題——均以 Material-UI 為基礎。

官網:https://material-ui.com/zh/

例子:https://material-ui.com/zh/getting-started/installation/

12、Vant Weapp

Vant Weapp,是有贊前端團隊開發維護, 是移動端 Vue 元件庫 Vant 的小程式版本,兩者基於相同的視覺規範,提供一致的 API 介面,助力開發者快速搭建小程式應用。

官網:https://youzan.github.io/vant-weapp/#/intro

更多關於前端UI框架請檢視下面的相關連結