前端的技術(shù)日漸更新亭敢，最近得空，花了一上午的時間腊尚，將前端常見的UI框架總結(jié)了一下吨拗，在開發(fā)的過程之中，有了這些婿斥，不斷能夠提高自己的工作效率劝篷，還可以在工作之余了解更多。希望大家喜歡民宿。
1.Layui
官方網(wǎng)址：http://www.layui.com/
Layui是一款采用自身模塊規(guī)范編寫的國產(chǎn)前端UI框架娇妓，遵循原生HTML/CSS/JS的書寫與組織形式，門檻極低活鹰，拿來即用哈恰。從核心代碼到API的每一處細(xì)節(jié)都經(jīng)過精心雕琢，非常適合界面的快速開發(fā)志群。着绷，從核心代碼到API的每一處細(xì)節(jié)都經(jīng)過精心雕琢，非常適合界面的快速開發(fā)锌云。Layui還很年輕荠医，首個版本發(fā)布于2016年金秋，她區(qū)別于那些基于MVVM底層的UI框架桑涎，卻并非逆道而行彬向，而是信奉返璞歸真之道。準(zhǔn)確地說攻冷，她更多是為服務(wù)端程序員量身定做娃胆，你無需涉足各種前端工具的復(fù)雜配置，只需面對瀏覽器本身等曼，讓一切你所需要的元素與交互里烦，從這里信手拈來。
2.NEC：
官方網(wǎng)址：http://nec.netease.com/case
你是否常常碰到以下問題：你總是看不懂他寫的代碼涉兽，或者讀起來很吃力招驴；你需要改他的代碼卻無從下手，或總是要去問他這里是什么改了會不會影響其他代碼枷畏；你和他一起開發(fā)一個產(chǎn)品别厘，你總是怕代碼和他有沖突或互相影響；你的代碼在多次維護(hù)任務(wù)之后變得越來越臃腫拥诡，越來越難以維護(hù)触趴，解決以上問題只需一種方法——讀我們的規(guī)范氮发！
3：amaze UI
官方網(wǎng)址：http://amazeui.org/
之前公司的網(wǎng)站被黑客攻擊之后，整個網(wǎng)站的東西都用不了了冗懦，處于丟失和癱瘓的狀態(tài)爽冕，樓主毫不猶豫在這個網(wǎng)站上找了一個框架，僅僅兩三天的時間披蕉，就成功挽救了這一糟糕的局面颈畸，還是要感謝我們這強大的框架，妹子UI,適配pc端和移動端没讲，功能齊全眯娱，網(wǎng)站開發(fā)什么的，都SOeasy
4.NEJ
官方網(wǎng)址：http://nej.netease.com/
NEJ全稱：Nice Easy Javascript 是由網(wǎng)易前端組工程師們發(fā)起創(chuàng)建的簡潔爬凑，美觀徙缴，真正的跨平臺web前端開發(fā)框架；在適配性上支持桌面及移動平臺嘁信、瀏覽器及混合應(yīng)用開發(fā)于样，補丁模式無縫擴(kuò)展適配平臺，配置方式靈活定制目標(biāo)平臺
5.bootstrap
框架官方網(wǎng)址：http://www.bootcss.com/
這個我就不多說了潘靖，大多數(shù)人都在用這個框架來開發(fā)穿剖，官方文檔的API完整可靠，還有各種Bootstrap相關(guān)優(yōu)質(zhì)項目推薦卦溢，前端開發(fā)首選框架
6：Foundation
官方網(wǎng)址：http://www.foundcss.com/
Foundation 是一個易用携御、強大而且靈活的響應(yīng)式前端框架，用于構(gòu)建基于任何設(shè)備上的響應(yīng)式網(wǎng)站既绕、 Web應(yīng)用和電子郵件。結(jié)構(gòu)語義化涮坐、移動設(shè)備優(yōu)先凄贩、完全可定制。
7.Jquery代碼庫
官方網(wǎng)址：http://www.jqueryui.org.cn/
8.jQuery插件庫
官方網(wǎng)址：http://www.jq22.com/
史上最全的jQuery效果袱讹，包括了開發(fā)所需要的所有需求的demo疲扎，如果有不會的東西，就來jQuery插件庫吧捷雕，這里總有一些你想要的椒丧，還在等什么？
9.FrozenUI
官方網(wǎng)址：http://frozenui.github.io/
隨心所用的樣式組件救巷，更顯靈動的JS插件壶熏，酷炫好玩的案例秀，提供的Animationcase浦译，把業(yè)務(wù)上有趣好玩的案例沉淀下來棒假，幫助日后能更快速找到設(shè)計靈感溯职。FrozenUI是一個開源的簡單易用，輕量快捷的移動端UI框架帽哑∶站疲基于手Q樣式規(guī)范，選取最常用的組件妻枕，做成手Q公用離線包減少請求僻族，升級方式友好，文檔完善屡谐，目前全面應(yīng)用在騰訊手Q增值業(yè)務(wù)中述么。
10：SUI
官方網(wǎng)址：http://m.sui.taobao.org/
SUI是一套基于bootstrap開發(fā)的前端組件庫，同時她也是一套設(shè)計規(guī)范康嘉。通過SUI碉输，可以非常方便的設(shè)計和實現(xiàn)精美的頁面。同時sui還有移動端版本msui，msui是阿里巴巴共享業(yè)務(wù)事業(yè)部UED團(tuán)隊的作品欺劳。目的是為了手機(jī)H5頁面提供一個常用的組件庫尔破，減少重復(fù)工作。
11:AUI
官方網(wǎng)址：http://www.auicss.com/
AUI2.0是一套全新的AUI框架阻荒，在1.X基礎(chǔ)上進(jìn)行了重新架構(gòu)。結(jié)合實際項目出發(fā)众羡，站在開發(fā)者和項目的角度侨赡，重新定義AUI框架。在2.0中使用了大量彈性響應(yīng)式布局粱侣，采用容器+布局結(jié)構(gòu)+控件的嵌套形式羊壹，方便開發(fā)者快速布局樣式。我們充分吸取了AUI使用者的反饋意見和借鑒了市場上其他優(yōu)秀UI框架齐婴，完成了2.0版本的開發(fā)油猫。2.0遵循GoogleMaterial 設(shè)計規(guī)范，使用MIT開源協(xié)議柠偶。
12:MUI：
官方網(wǎng)址：http://dev.dcloud.net.cn/mui/
最接近原生APP體驗的高性能前端框架,相信這個大家都不陌生：鑒于之前的很多前端框架（特別是響應(yīng)式布局的框架）情妖，UI控件看起來太像網(wǎng)頁，沒有原生感覺诱担，因此追求原生UI感覺也是我們的重要目標(biāo)MUI以iOS平臺UI為基礎(chǔ)毡证，補充部分Android平臺特有的UI控件
13:Semantic UI
官方網(wǎng)址：http://www.semantic-ui.cn/
Semantic作為一款開發(fā)框架，幫助開發(fā)者使用對人類友好的HTML語言構(gòu)建優(yōu)雅的響應(yīng)式布局蔫仙。更快地設(shè)計賞心悅目的網(wǎng)站
官方網(wǎng)址：http://www.oschina.net/p/aliceui?fromerr=mgWZvlr0
Aliceui是支付寶的樣式解決方案料睛，是一套精選的基于 spm 生態(tài)圈的樣式模塊集合，是 Arale 的子集，也是一套模塊化的樣式命名和組織規(guī)范秦效，是寫 CSS 的更好方式雏蛮。
官網(wǎng)地址：http://www.h-ui.net/
H-ui是輕量級前端框架，簡單免費阱州，兼容性好挑秉，適用于中國網(wǎng)站。H-ui是一個相對成長比較慢的前端框架苔货，相比目前行業(yè)眾多框架還有很多不足犀概。但初心不改，實實在在把事做好夜惭，做用戶最喜歡的框架姻灶。
官網(wǎng)地址：https://github.com/weui/weui
weUI是一套同微信原生視覺體驗一致的基礎(chǔ)樣式庫，由微信官方設(shè)計團(tuán)隊為微信 Web開發(fā)量身設(shè)計诈茧，可以令用戶的使用感知更加統(tǒng)一产喉。包含button、cell敢会、dialog曾沈、 progress、toast鸥昏、article塞俱、actionsheet、icon等各式元素吏垮。
官網(wǎng)地址：http://www.ydui.org/
YDUI Touch 專為移動端打造障涯，在技術(shù)實現(xiàn)、交互設(shè)計上兼容主流移動設(shè)備膳汪，保證代碼輕唯蝶、性能高;使用 Flex 技術(shù)，靈活自如地對齊遗嗽、收縮生棍、擴(kuò)展元素，輕松搞定移動頁面布局;實現(xiàn)強大的屏幕適配布局媳谁，等比例適配所有屏幕。什么友酱？用得不開心晴音？輕松切換 px;自定義JavaScript組件、Less文件缔杉、Less變量锤躁，定制一份屬于自己的YDUI;
18.ZUI
官方網(wǎng)址：http://zui.sexy/
簡友補充的，現(xiàn)在添上或详，一個基于 Bootstrap 深度定制開源前端實踐方案系羞，幫助你快速構(gòu)建現(xiàn)代跨屏應(yīng)用郭计。基于 Flex 設(shè)計椒振，支持移動端全部主流瀏覽器昭伸，支持 Android 微信內(nèi)置瀏覽器
19：EasyUI
官方網(wǎng)址：http://www.jeasyui.net/
easyui是一種基于jQuery的用戶界面插件集合。為創(chuàng)建現(xiàn)代化澎迎，互動庐杨，JavaScript應(yīng)用程序，提供必要的功能夹供。使用easyui你不需要寫很多代碼灵份，你只需要通過編寫一些簡單HTML標(biāo)記，就可以定義用戶界面哮洽。完美支持HTML5網(wǎng)頁的完整框架填渠。節(jié)省您網(wǎng)頁開發(fā)的時間和規(guī)模。
20：pure
官方網(wǎng)址：http://purecss.org/layouts/
Pure精心設(shè)計鸟辅，只為可以在任何Web項目中使用氛什。為了例證這一點，我們制作了如下幾個模板剔桨。這些模板都是響應(yīng)式的屉更，并且沒有使用任何JavaScript。
原文作者：祈澈姑娘技術(shù)博客：http://www.reibang.com/u/05f416aefbe1
90后前端妹子洒缀，愛編程瑰谜，愛運營，愛折騰树绩。
堅持總結(jié)工作中遇到的技術(shù)問題萨脑，堅持記錄工作中所所思所見，歡迎大家一起探討交流饺饭。
