介

Ionic Github star 數38K+, MIT協議，可以使用Web技術輕松構建高質量的原生(IOS, Android)和漸進式Web應用程序(PWA)。Ionic Framework是100％免費和MIT開源，Ionic Framework 是個高級的 HTML5 移動端應用框架,Ionic Framework是一個開源UI工具包，用于使用Web技術（HTML，CSS和JavaScript）構建高性能的高質量移動和桌面應用程序,Ionic Framework專注于前端用戶體驗，或應用程序的UI交互（控件，交互，手勢，動畫）。它易于學習，并與其他庫或框架（如Angular,Vue,React）很好地集成，或者可以獨立使用而無需使用簡單腳本包含的前端框架。官網截圖如下

免費

跨平臺

構建和部署跨多個平臺的應用程序，例如本機iOS，Android，桌面(Electron)和Web作為漸進式Web應用程序(PWA) - 所有這些都具有一個代碼庫。寫一次，隨處運行。

生態系統

Ionic Framework由核心團隊積極開發和維護，其生態系統由開發人員和貢獻者的國際社區指導，推動其發展和采用。大大小小的開發人員和公司都使用Ionic來構建和運送各種各樣的應用程序。全球200多個國家/地區有數百萬的Ionic開發人員。

豐富的組件

ionic 大約有90個以上組件并且三個前端框架(Vue, Angular,React)都支持，包括彈出框，卡片，網格，導航等等非常非常多，具體可以自行去官網查看。以下截圖是vuejs下的ion-action-sheet 組件文檔頁包含組件顯示效果。組件文檔也是非常豐富。

LOGO

由于版本升級，ionic 默認logo 顏色由藍色變成黑色，鼠標移動到logo才變藍色。

Foundation框架

Foundation是一個響應式前端框架系列，可以輕松設計漂亮的響應式網站，應用程序和電子郵件，在任何設備上看起來都很棒。Foundation是語義，可讀，靈活且完全可定制的。我們不斷添加新的資源和代碼片段，包括這些方便的HTML模板，以幫助您入門！

特點：世界上最先進的響應式前端框架。快速為適用于任何類型設備的站點創建原型和生產代碼。

總結：Foundation 算是框架界的元老啦，都說框架去的早，而這個框架一直到現在依然這么的熱門，如果你比較介意 Bootstrap 開發撞臉的尷尬事情，那么你可以考慮使用 Foundation 。即使你使用預定義的 UI 元素, 也不會與其他網站太像，就像官方說的給開發者更靈活的框架體驗。

Bootstrap框架

Bootstrap是美國Twitter公司的設計師Mark Otto和Jacob Thornton合作基于HTML、CSS、JavaScript 開發的簡潔、直觀、強悍的前端開發框架，使得 Web 開發更加快捷。 Bootstrap提供了優雅的HTML和CSS規范，它即是由動態CSS語言Less寫成。Bootstrap一經推出后頗受歡迎，一直是GitHub上的熱門開源項目，包括NASA的MSNBC（微軟全國廣播公司）的Breaking News都使用了該項目。 國內一些移動開發者較為熟悉的框架，如WeX5前端開源框架等，也是基于Bootstrap源碼進行性能優化而來。

包含內容：

基本結構：Bootstrap 提供了一個帶有網格系統、鏈接樣式、背景的基本結構。

CSS：Bootstrap 自帶以下特性：全局的 CSS設置、定義基本的 HTML 元素樣式、可擴展的 class，以及一個先進的網格系統。

組件：Bootstrap 包含了十幾個可重用的組件，用于創建圖像、下拉菜單、導航、警告框、彈出框等等。

JavaScript 插件：Bootstrap包含了十幾個自定義的jQuery 插件。您可以直接包含所有的插件，也可以逐個包含這些插件。

定制：您可以定制Bootstrap的組件、LESS 變量和jQuery 插件來得到您自己的版本。

總結：Bootstrap 最大的優勢就是它非常流行，流行就代表你有問題就有很多人幫你解決問題，就代表裝逼它就是利器，還有就是界面比較和諧，容易上手，關注它的小伙伴應該發現最新 V4 版也開始支持 FlexBox 布局，這是非常好的升級體驗。 劣勢是 class 命名不夠語義化，并且各種縮寫，以至于我離了文檔就是個菜，最近開始整混合 APP，選框架的時候首選就是它，但之前搞 PC 一直沒注意，后來搞混合右鍵屬性看它的時候，瞬間一陣涼風襲來，Bootstrap 好小，小到我只好選擇別的框架。

AUI框架

AUI為一款輕量級前端UI框架，更偏重于CSS布局及樣式的構造，通俗易懂的寫法及模塊式的拼裝方便用戶自由擴展。輕小的體積、靈活的擴展性，大大提高移動端項目的體驗度和開發效率。

在目前市場上的UI框架中，大多數的框架以JS來實現過多的功能和布局。當然并不是否定JS在一個移動前端框架中的作用性，既然是前端框架側重點要更多的考慮框架本身在一個項目中的資源消耗問題及如何提高用戶的體驗度。鑒于APICloud多窗口結構及原生模塊的拼裝，所以在移動端項目中AUI強調更多的是快速布局、靈活布局的實現，結合APICloud本身特性，提高開發效率及用戶體驗。

最近剛起來的AUI，雖然作者聲稱是專為APICloud開發者設計的一套UI框架，但實際它還是解決了很多移動前端開發的普遍問題，是主要面向混合開發的 CSS 框架。看起來作者比較猖狂，各種高級 CSS3 遍地使用，這讓我也不得不去查查這些個 CSS3 的兼容性。不負眾望果然選的都是兼容不錯的屬性，哈哈了一頓激動從前輩手上大膽認識了幾個好東西，并且框架還提供了聊天界面、計數列表等組件，解決了很多復雜的讓我罵娘的布局，現在可以直接拿走就用。

總結：這個框架對我來說有個優點就是純 CSS 框架，自己以前也就用過 Pure，自己有點 JS 能力，如果不是復雜的效果，找個純 CSS 框架自己隨便改改就可以，而現在 CSS3 也已經能夠做到動畫，效率、質量、高效全兼顧，所以還是選擇了這種 CSS 框架。有一點覺得不滿的是這框架的文檔真的好那什么，說好的高大上呢。

Amaze UI 框架

第二個介紹的是AmazeUI，據官方說是咱們中國首個HTML5跨屏前端框架。

最初使用它是因為本尊遇到了一個愛糾結細節設計，有一次她跟我的字體較上真了，結果一句頂萬句的 BOOS 夸了她，我只好根據她的想法去解決，結果最后找到了Amaze UI 框架，按照官方的話說就是 "基于社區開源項目構建的一個跨屏前端框架，以移動優先，從小屏到大屏，最終實現所有屏幕適配，適應移動互聯潮流" 。但其實我就是看中它能解決國內瀏覽器存在的跨屏適配和兼容性問題。

總結：Amaze UI 總的來說就是加入更多符合中國市場特性的元素，框架對跨屏、適配都做了的比較好的處理并且準備一了一系列的常用的網頁組件，為減少搞兼容、適配各種敲鍵盤的加班狗們的工作時間做了不小的貢獻。框架還對中文排版優化，兼容中國本土主流瀏覽器、輕量化，不僅適用于桌面端，還更更適合移動端、包含一些封裝好的Widgets。不過自也就我感覺 Amaze UI 文檔是否有點太那什么了，比如 “人們不會在乎jQuery的那點流量。”，說實的在這真沒啥，不過我從來不會說出來( 哈哈 )，代碼和設計上感覺沒太多突出的點。

Pure框架

一組小的，響應迅速的CSS模塊，您可以在每個Web項目中使用它們。

特點：

CSS占用空間極小。

純凈是微不足道的。整套模塊的時鐘頻率為3.8KB *縮小和壓縮。在考慮移動設備的情況下，對我們來說保持文件大小很小很重要，并且仔細考慮了每一行CSS。如果您決定僅使用這些模塊的子集，則可以節省更多字節。

你的CSS基礎

Pure構建于Normalize.css之上，為原生HTML元素以及最常見的UI組件提供布局和樣式。這就是你所需要的，沒有任何瑕疵。

以移動為主題

Pure是開箱即用的響應，因此所有屏幕尺寸的元素都很棒。

堅持你的方式

Pure具有最小的樣式，并鼓勵您在其上編寫應用程序樣式。它旨在讓您不受約束，并輕松覆蓋樣式。

創建響應式布局

通過使用Grids，Menus等，可以輕松地為所有屏幕尺寸創建漂亮的響應式布局。我們讓您輕松上手。看看幾個不同的布局，并用堅如磐石的基礎開始您的下一個Web項目。

這個框架是我在做管理系統時接觸的，選擇使用也是因為框架小巧，并且是純 CSS，沒有太多的牽扯，好用來與其他框架快速結合使用。