


In addition to bootstrap, what other front-end frameworks are there?
Front-end frameworks except bootstrap: 1. Foundation; 2. AUI; 3. Frozen UI; 4. WeUI; 5. SUI; 6. Semantic UI; 7. UiKit; 8. Pure.
The operating environment of this tutorial: Windows 10 system, bootstrap version 3.3.7, DELL G3 computer
What other front-end frameworks are there besides bootstrap
AUI
The third one is AUI that has just emerged recently. Although the author claims that it is a UI framework specially designed for APICloud developers, in fact it still solves the problem. A common problem with many mobile front-end development is that CSS frameworks are mainly oriented towards hybrid development. It seems that the author is quite aggressive and uses various advanced CSS3s everywhere, which makes me have to check the compatibility of these CSS3s. Living up to expectations, I chose all the attributes that are compatible with each other. I was so excited that I learned a few good things from my seniors. The framework also provides components such as chat interfaces and counting lists, which solved many complex problems that made me curse. The layout can now be taken and used directly.
Summary: One advantage of this framework for me is that it is a pure CSS framework. I have used Pure before and I have some JS ability. If it is not a complicated effect, I can find a pure CSS framework and modify it myself. That's fine, and now CSS3 can also achieve animation, taking into account efficiency, quality, and efficiency, so I still chose this CSS framework. One thing I am dissatisfied with is that the documentation of this framework is really good, and it is said to be superior.
Frozen UI
Some time ago I saw that QQ instantly became taller. Later, I asked around and found out that QQ customer service also uses hybrid development, among which QQ member front-end uses It is Frozen UI, and this framework is open source. I was so happy that I could not bear the loneliness in my heart and tried it directly. In my first experience, I felt that the basic style effect is simple and the colors are refreshing. There is a relatively active community, so the components are relatively rich.
Summary: It would be cool to use Frozen UI with something like APICloud to make a hybrid APP, or use native turkeys to nest in the application for front-end development. This framework is suitable for android 2.3, It is compatible with ios 4.0, or it is an excellent choice to use it as a Web App. The disadvantages can be seen from the UI level. Who makes it born on the QQ member front-end?
WeUI
Both WeUI and FrozenUI are relatively specialized frameworks. WeUI is more specialized than FrozenUI. It doesn’t even have an official website. All questions and answers are on gitHub. Issues solved. This framework is extremely simple. Of course, the size is not to mention. There are only about 7 modules. However, the size is small but the work is good. The word-of-mouth rating is enough. The framework has been released on github since 16/1/23. The star exceeds 7K, but it does not rule out that users have no place to vent, so they all go to git, haha.
SUI
"SUI is a front-end component library developed based on bootstrap. It is also a set of design specifications. Through SUI, it can be very convenient to design and implement Beautiful page”. Sure enough, it is better to directly quote the boring official advertisement to save your own brain cells (囧...). Of course, as the advertisement said, if you have used Bootstrap before, you can easily switch to SUI. This may be what Taobao gives to the front-end losers. Welfare.
Semantic UI
The third from the bottom is Semantic UI. I came into contact with this framework because of Bootstrap. As soon as Semantic UI was launched on github, it attracted the attention of a large number of developers. Many people compare the two and criticize and praise them. You can't just raise your finger and start liking them just based on others' three or four sentences. After using them, I feel that the UI is not much different from Bootstrap, but the code naming convention But there is a big difference. I think Semantic UI just wants to do something different. Its naming is all in a compound way, and the class names are very discrete. When using it, you have to be careful about naming the classes you expand or add. Its class name conflicts.
Foundation
Foundation is considered a veteran in the framework industry. It is said that frameworks arrived early, and this framework is still so popular today. If you care more about Bootstrap If you develop embarrassing things that hit your face, then you can consider using Foundation. Even if you use predefined UI elements, it will not be too similar to other websites, just like the official said to give developers a more flexible framework experience.
UiKit
UIkit is developed by the YOOtheme team and is used in many WordPress themes (that is, if you are a WordPress enthusiast, then this framework should be more suitable In-depth study), and the framework can be edited through the GUI editor and manually, so it provides a flexible and powerful customization mechanism. The framework integrates the unique features of LESS, jQuery, normalize.css and FontAwesome open source projects into such a lightweight and modular front-end framework.
Pure
I came into contact with this framework when I was working on a management system. I chose to use it because the framework is compact and pure CSS. It doesn’t involve too much and is easy to use. To quickly combine with other frameworks.
Related recommendations: bootstrap tutorial
The above is the detailed content of In addition to bootstrap, what other front-end frameworks are there?. For more information, please follow other related articles on the PHP Chinese website!

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

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics



How to use Bootstrap to get the value of the search bar: Determines the ID or name of the search bar. Use JavaScript to get DOM elements. Gets the value of the element. Perform the required actions.

Use Bootstrap to implement vertical centering: flexbox method: Use the d-flex, justify-content-center, and align-items-center classes to place elements in the flexbox container. align-items-center class method: For browsers that do not support flexbox, use the align-items-center class, provided that the parent element has a defined height.

There are two ways to create a Bootstrap split line: using the tag, which creates a horizontal split line. Use the CSS border property to create custom style split lines.

There are several ways to insert images in Bootstrap: insert images directly, using the HTML img tag. With the Bootstrap image component, you can provide responsive images and more styles. Set the image size, use the img-fluid class to make the image adaptable. Set the border, using the img-bordered class. Set the rounded corners and use the img-rounded class. Set the shadow, use the shadow class. Resize and position the image, using CSS style. Using the background image, use the background-image CSS property.

To adjust the size of elements in Bootstrap, you can use the dimension class, which includes: adjusting width: .col-, .w-, .mw-adjust height: .h-, .min-h-, .max-h-

To set up the Bootstrap framework, you need to follow these steps: 1. Reference the Bootstrap file via CDN; 2. Download and host the file on your own server; 3. Include the Bootstrap file in HTML; 4. Compile Sass/Less as needed; 5. Import a custom file (optional). Once setup is complete, you can use Bootstrap's grid systems, components, and styles to create responsive websites and applications.

Using Bootstrap in Vue.js is divided into five steps: Install Bootstrap. Import Bootstrap in main.js. Use the Bootstrap component directly in the template. Optional: Custom style. Optional: Use plug-ins.

How to use the Bootstrap button? Introduce Bootstrap CSS to create button elements and add Bootstrap button class to add button text
