html5行動框架有哪些

html5行動框架：Framework7、SUI Mobile、FrozenUI、Amaze UI、MUI、WeUI、VUX、WEEX、antd-mobile、vue-carbon、uiKit、H-ui、layui、vonic等等。

本教學操作環境：windows7系統、HTML5版、Dell G3電腦。

行動Web UI函式庫（H5框架）清單

#Framework7

Framework7 是一個開源免費的框架。可以用來開發混合行動應用程式（原生和 HTML 混合）或開發 iOS & Android 風格的 WEB APP。也可以用來作為原型開發工具，可以迅速創造一個應用的原型。

使用時只需要一個基本的 HTML 佈局，並且把 Framework7 的 CSS 和 JS 檔案引進即可！ Framework7 不會強迫你寫任何自訂的標籤，也不會透過 JS 來產生任何額外的內容。你不需要透過 JS 或 JSON 來寫頁面，只需要普通的 HTML 就可以。

Framework7 有大量可以直接使用的 UI 元件和工具，例如 modals,popup,action sheet, popover, list views, media lists, tabs, side panels, layout grid, preloader, form elements 等。大部分的元件你完全不需要寫任何 JS 程式碼。

SUI Mobile 

MSUI 是阿里巴巴共享業務事業部UED團隊的作品。目的是為了手機H5頁面提供一個常用的元件庫，減少重複工作。

SUI Mobile 是一套基於 Framework7 開發的UI函式庫。它非常輕量、精美，只需要引入我們的CDN檔案就可以使用，並且能相容於 iOS 6.0 和 Android 4.0 ，非常適合開發跨平台Web App。

FrozenUI

Frozen UI是一個開源的簡單易用，輕量快速的行動端UI框架。基於手Q樣式規範，選取最常用的組件，

做成手Q公用離線包減少請求，升級方式友好，文檔完善，目前全面應用在騰訊手Q增值業務中。

Amaze UI

中國首個開源HTML5 跨螢幕前端框架，相比國外框架，Amaze UI 專注於中文排版，根據用戶代理調整字體，實現更好的中文排版效果；兼顧國內主流瀏覽器及App 內建瀏覽器相容支援。

Amaze UI 以行動優先（Mobile first）為理念，從小屏逐步擴展到大屏，最終實現所有螢幕適配，適應行動互聯潮流。

MUI

最接近原生APP體驗的高效能前端框架。

WeUI

WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊為微信內網頁和微信小程式量身設計，令使用者的使用感知更加統一。

VUX

Vux（讀音[v'ju:z]，同views）是基於WeUI和Vue(2.x)開發的行動裝置UI元件庫，主要服務於微信頁面。

基於webpack vue-loader vux可以快速開發行動裝置頁面，配合vux-loader方便你在WeUI的基礎上自訂所需的樣式。

vux-loader保證了元件按需使用，因此不用擔心最終打包了整個vux的元件庫程式碼。

WEEX

Weex 是一套簡單易用的跨平台開發方案，能以web 的開發體驗建立高效能、可擴展的native 應用，為了做到這些，Weex 與Vue 合作，使用Vue 作為上層框架，並遵循W3C 標準實現了統一的JSEngine 和DOM API，這樣一來，你甚至可以使用其他框架驅動Weex，打造三端一致的native 應用。

Ant Design Mobile

antd-mobile 是 Ant Design 的移動規範的 React 實現，服務於螞蟻及口碑無線業務。

vue-carbon

基於 vuejs 1.0 開發 material design 風格的行動裝置 WEB UI 函式庫, 設計資源參考 CARBON FrameWork7。

uiKit

uiKit是一款輕量、模組化的前端框架，可快速建立強大的web前端介面。

H-ui

H-ui是輕量級前端框架，簡單免費，相容性好，適用於中國網站。

layui

Layui 誕生於2016年金秋，是一款帶著濃烈情懷的國產前端UI框架，她追求極簡，又不失豐盈的內在，說她是史上最輕的結晶，似乎不為過。一切都源自於她對原生態的執著，對前端社群的那些雜訊聲音的過濾，以及她本身的精心雕琢。

YDUI Touch

YDUI Touch 專為行動端打造，在技術實作、互動設計上相容主流行動設備，保證程式碼輕、效能高;使用Flex 技術，靈活自如地對齊、收縮、擴展元素，輕鬆搞定移動頁面佈局;實現強大的屏幕適配佈局，等比例適配所有屏幕。什麼？用得不開心？輕鬆切換 px;自訂Javascript元件、Less檔、Less變量，自訂一份屬於自己的YDUI。

sheral

#

基於sandal（基礎sass函式庫）擴充功能的行動端UI函式庫。具體設計想法可參考sheral－一個方便自訂及擴充的UI元件庫

vonic

一個基於vue.js 和ionic 樣式的UI 框架，用於快速建立行動端單頁應用程式。

Mint UI

基於Vue.js 的行動裝置元件庫

Mint UI 包含豐富的CSS 和JS 元件，能夠滿足日常的移動端開發需要。透過它，可以快速建立風格統一的頁面，提升開發效率。

真正意義上的按需載入元件。可以只載入聲明過的元件及其樣式文件，無需再糾結文件體積過大。

考慮到行動裝置的效能門檻，Mint UI 採用 CSS3 處理各種動效，避免瀏覽器進行不必要的重繪和重排，從而使用戶獲得流暢順滑的體驗。

依托 Vue.js 高效的元件化方案，Mint UI 做到了輕量化。即使全部引入，壓縮後的檔案體積也僅有 ~30kb (JS CSS) gzip。

Muse-UI

基於Vue 2.0 和Material Desigin 的UI 元件庫

1.元件豐富

Muse UI 基本實現了Material Design 設計規格類別的所有元件，另外還開發許多的功能性的元件

2.可自訂

Muse UI 使用less文件，所有的顏色都有一個變數維護，透過撰寫less 檔案完成自訂主題，另外元件內部也提供一些修改效果的參數

3.基於Vue 2.0

Muse UI 基於Vue2.0 開發，Vue2.0是當下最快的前端框架之一，小巧，api友好，可用於開發的複雜單頁應用程式。

jQuery WeUI

jQuery WeUI 是專為微信公眾帳號開發而設計的一個簡潔而強大的UI庫，包含全部WeUI官方的CSS元件，並且額外提供了大量的拓展元件，豐富的元件庫可以大幅減少前端開發時間。

jQuery WeUI 的最大特點是它只提供UI元件，並不會對專案所使用的框架和其他函式庫有任何的限制，幾乎可以在任何環境下使用。無論你的專案是基於jQuery，還是 React, Angular, Vue， 你都會發現 jQuery WeUI 能非常方便的和他們結合使用。既是你的項目是一個有很悠久歷史的老項目，也幾乎可以做到拿來即用。

國外官網：http://jqweui.com/

QMUI Web

QMUI Web 是一個專注Web UI 開發，幫助開發者快速實現特定的一整套設計的框架。

框架主要由一個強大的 Sass 方法集合與內建的工作流程構成。透過 QMUI Web，開發者可以輕鬆提高 Web UI 開發的效率，同時保持了專案的高可維護性與穩健。

該框架同步有針對Android和IOS風格的行動UI框架。

推薦教學：《html影片教學》

以上是html5行動框架有哪些的詳細內容。更多資訊請關注PHP中文網其他相關文章！