html5 mobile framework: Framework7, SUI Mobile, FrozenUI, Amaze UI, MUI, WeUI, VUX, WEEX, antd-mobile, vue-carbon, uiKit, H-ui, layui, vonic, etc.
The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.
Mobile Web UI library (H5 framework) list
Framework7
Framework7 is an open source Free framework. It can be used to develop hybrid mobile applications (mixed native and HTML) or develop iOS & Android style WEB APPs. It can also be used as a prototype development tool to quickly create an application prototype.
You only need a basic HTML layout and import the CSS and JS files of Framework7! Framework7 does not force you to write any custom tags, nor does it generate any additional content through JS. You don't need to write the page via JS or JSON, just plain HTML.
Framework7 has a large number of UI components and tools that can be used directly, such as modals, popup, action sheet, popover, list views, media lists, tabs, side panels, layout grid, preloader, form elements, etc. For most components you don’t need to write any JS code at all.
SUI Mobile
MSUI is the work of the UED team of Alibaba Sharing Business Division. The purpose is to provide a commonly used component library for mobile H5 pages to reduce duplication of work.
SUI Mobile is a set of UI libraries developed based on Framework7. It is very lightweight and beautiful. You only need to introduce our CDN file to use it. It is compatible with iOS 6.0 and Android 4.0, making it very suitable for developing cross-platform Web Apps.
FrozenUI
Frozen UI is an open source, easy-to-use, lightweight and fast mobile UI framework. Based on the Mobile QQ style specifications, the most commonly used components are selected and
is made into a public offline package for Mobile QQ to reduce requests, has a friendly upgrade method and complete documentation. It is currently fully used in Tencent Mobile QQ value-added services.
Amaze UI
China's first open source HTML5 cross-screen front-end framework. Compared with foreign frameworks, Amaze UI focuses on Chinese typesetting and adjusts fonts according to the user agent to achieve better results. Chinese typesetting effect; taking into account the compatibility support of domestic mainstream browsers and the built-in browser of the App.
Amaze UI takes mobile first as its concept, gradually expands from small screens to large screens, and finally realizes adaptation to all screens to adapt to the trend of mobile Internet.
MUI
The high-performance front-end framework closest to the native APP experience.
WeUI
WeUI is a set of basic style libraries that are consistent with WeChat’s native visual experience. It is designed by the WeChat official design team for WeChat internal web pages and WeChat mini programs. , making users’ usage perception more unified.
VUX
Vux (pronounced [v'ju:z], the same as views) is a mobile UI component library developed based on WeUI and Vue (2.x) , mainly serving WeChat pages.
Based on webpack vue-loader vux can quickly develop mobile pages. With vux-loader, you can customize the styles you need based on WeUI.
vux-loader ensures that components are used on demand, so you don’t have to worry about eventually packaging the entire vux component library code.
WEEX
Weex is a simple and easy-to-use cross-platform development solution that can build high-performance and scalable native applications with a web development experience. In order to do To this end, Weex cooperates with Vue, uses Vue as the upper-layer framework, and implements unified JSEngine and DOM API in accordance with W3C standards. In this way, you can even use other frameworks to drive Weex and create native applications that are consistent on three ends.
Ant Design Mobile
antd-mobile is a React implementation of Ant Design’s mobile specification, serving Ant and Koubei wireless businesses.
vue-carbon
Developed material design style mobile WEB UI library based on vuejs 1.0, design resources refer to CARBON FrameWork7.
uiKit
uiKit is a lightweight, modular front-end framework that can quickly build a powerful web front-end interface.
H-ui
H-ui is a lightweight front-end framework, simple and free, with good compatibility and suitable for Chinese websites.
layui
Layui was born in the golden autumn of 2016. It is a domestic front-end UI framework with strong feelings. It pursues minimalism without losing its rich connotation. , it does not seem to be an exaggeration to say that she is the lightest crystal in history. Everything stems from her persistence in the original ecology, filtering out the noise in the front-end community, and her own meticulous craftsmanship.
YDUI Touch
YDUI Touch is specially built for mobile terminals. It is compatible with mainstream mobile devices in terms of technical implementation and interaction design, ensuring light code and high performance; using Flex technology , flexibly align, shrink, and expand elements to easily handle mobile page layouts; implement powerful screen adaptation layouts that adapt to all screens in equal proportions. What? Not happy with it? Easily switch px; customize Javascript components, Less files, Less variables, and customize your own YDUI.
sheral
Mobile UI library based on sandal (basic sass library) extension. For specific design ideas, please refer to sheral - a UI component library that is convenient for customization and expansion
vonic
A UI framework based on vue.js and ionic style, used for Quickly build mobile single-page applications.
Mint UI
Mobile component library based on Vue.js
Mint UI contains rich CSS and JS components, which can meet daily mobile needs End development needs. Through it, you can quickly build a page with a unified style and improve development efficiency.
True loading of components on demand. You can load only the declared components and their style files, without worrying about the file size being too large.
Considering the performance threshold of the mobile terminal, Mint UI uses CSS3 to handle various animations to avoid unnecessary redrawing and rearrangement of the browser, so that users can obtain a smooth and smooth experience.
Relying on the efficient componentization solution of Vue.js, Mint UI is lightweight. Even if all are imported, the compressed file size is only ~30kb (JS CSS) gzip.
Muse-UI
UI component library based on Vue 2.0 and Material Design
1. Rich components
Muse UI basics Implemented all components of the Material Design design specification class, and also developed many functional components
2. Customizable
Muse UI uses less files, and all colors are maintained by a variable , complete the custom theme by writing less files, and also provide some parameters for modifying the effect inside the component
3. Based on Vue 2.0
Muse UI is developed based on Vue2.0, Vue2.0 is the current One of the fastest front-end frameworks, small, API-friendly, and can be used to develop complex single-page applications.
jQuery WeUI
jQuery WeUI is a simple and powerful UI library designed specifically for WeChat public account development. It contains all WeUI official CSS components, and additional A large number of expansion components are provided, and the rich component library can greatly reduce front-end development time.
The biggest feature of jQuery WeUI is that it only provides UI components and does not place any restrictions on the frameworks and other libraries used in the project. It can be used in almost any environment. Whether your project is based on jQuery, React, Angular, or Vue, you will find that jQuery WeUI can be used very conveniently in combination with them. Even if your project is an old project with a long history, it can almost be used out of the box.
Foreign official website: http://jqweui.com/
QMUI Web
QMUI Web is a website that focuses on Web UI development to help developers quickly A framework that implements a specific set of designs.
The framework is mainly composed of a powerful collection of Sass methods and built-in workflows. Through QMUI Web, developers can easily improve the efficiency of Web UI development while maintaining high maintainability and robustness of the project.
This framework synchronizes mobile UI frameworks for Android and IOS styles.
Recommended tutorial: "html video tutorial"
The above is the detailed content of What are the html5 mobile frameworks?. For more information, please follow other related articles on the PHP Chinese website!

H5 provides a variety of new features and functions, greatly enhancing the capabilities of front-end development. 1. Multimedia support: embed media through and elements, no plug-ins are required. 2. Canvas: Use elements to dynamically render 2D graphics and animations. 3. Local storage: implement persistent data storage through localStorage and sessionStorage to improve user experience.

H5 and HTML5 are different concepts: HTML5 is a version of HTML, containing new elements and APIs; H5 is a mobile application development framework based on HTML5. HTML5 parses and renders code through the browser, while H5 applications need to run containers and interact with native code through JavaScript.

Key elements of HTML5 include,,,,,, etc., which are used to build modern web pages. 1. Define the head content, 2. Used to navigate the link, 3. Represent the content of independent articles, 4. Organize the page content, 5. Display the sidebar content, 6. Define the footer, these elements enhance the structure and functionality of the web page.

There is no difference between HTML5 and H5, which is the abbreviation of HTML5. 1.HTML5 is the fifth version of HTML, which enhances the multimedia and interactive functions of web pages. 2.H5 is often used to refer to HTML5-based mobile web pages or applications, and is suitable for various mobile devices.

HTML5 is the latest version of the Hypertext Markup Language, standardized by W3C. HTML5 introduces new semantic tags, multimedia support and form enhancements, improving web structure, user experience and SEO effects. HTML5 introduces new semantic tags, such as, ,, etc., to make the web page structure clearer and the SEO effect better. HTML5 supports multimedia elements and no third-party plug-ins are required, improving user experience and loading speed. HTML5 enhances form functions and introduces new input types such as, etc., which improves user experience and form verification efficiency.

How to write clean and efficient HTML5 code? The answer is to avoid common mistakes by semanticizing tags, structured code, performance optimization and avoiding common mistakes. 1. Use semantic tags such as, etc. to improve code readability and SEO effect. 2. Keep the code structured and readable, using appropriate indentation and comments. 3. Optimize performance by reducing unnecessary tags, using CDN and compressing code. 4. Avoid common mistakes, such as the tag not closed, and ensure the validity of the code.

H5 improves web user experience with multimedia support, offline storage and performance optimization. 1) Multimedia support: H5 and elements simplify development and improve user experience. 2) Offline storage: WebStorage and IndexedDB allow offline use to improve the experience. 3) Performance optimization: WebWorkers and elements optimize performance to reduce bandwidth consumption.

HTML5 code consists of tags, elements and attributes: 1. The tag defines the content type and is surrounded by angle brackets, such as. 2. Elements are composed of start tags, contents and end tags, such as contents. 3. Attributes define key-value pairs in the start tag, enhance functions, such as. These are the basic units for building web structure.


Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

mPDF
mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

SublimeText3 Linux new version
SublimeText3 Linux latest version

VSCode Windows 64-bit Download
A free and powerful IDE editor launched by Microsoft

SAP NetWeaver Server Adapter for Eclipse
Integrate Eclipse with SAP NetWeaver application server.

Safe Exam Browser
Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.
