Heim  >  Artikel  >  Web-Frontend  >  Top 10 der beliebtesten CSS-Frameworks

Top 10 der beliebtesten CSS-Frameworks

Guanhui
Guanhuinach vorne
2020-05-05 09:31:444302Durchsuche

Webentwicklungsingenieure müssen viel Zeit mit der Entwicklung von Seitenstilen verbringen. Am einfachsten ist es, ein CSS-Framework zu verwenden Quelle, was sind also einige gute CSS-Frameworks?

Ich habe einige Informationen und Daten gesammelt, um sie mit Ihnen zu besprechen. Jetzt werde ich über die Top 10 CSS-Frameworks mit den meisten Sternen auf Github sprechen.

Bootstrap

Github-Sterneanzahl 140.000.

GitHub-Adresse: https://github.com/twbs/bootstrap

Bootstrap ist das beliebteste CSS-Framework und gilt als das reaktionsschnellste CSS-Framework. Es wurde speziell für die Front-End-Entwicklung entwickelt und hilft beim Erstellen von Webdesign-Konzepten, Mobile-First-Projekten, Rastersystemen, Typografie, Schaltflächen und mehr.

Semantische Benutzeroberfläche

Github-Staranzahl 47,8K.

GitHub-Adresse: https://github.com/Semantic-Org/Semantic-UI

Semantic ist ein Entwicklungsframework, das dabei hilft, schöne responsive Layouts mit benutzerfreundlichem HTML zu erstellen. Semantic UI zielt darauf ab, den Website-Erstellungsprozess semantischer zu gestalten. Das Hauptmerkmal besteht darin, Prinzipien der natürlichen Sprache zu verwenden, um das Lesen und Verstehen des Codes zu erleichtern.

Materialise

Github-Sterneanzahl 37,5K.

GitHub-Adresse: https://github.com/Dogfalo/materialize

Materialise ist ein Front-End-Framework, das auf Material Design basiert, die Selbstanpassung unterstützt und voller Modernität ist.

Bulma

Github-Sterneanzahl 39,6K.

GitHub-Adresse: https://github.com/jgthms/bulma

Bulma ist ein modernes CSS-Framework, das auf Flexbox basiert. Es ist responsiv, modular, Open Source und kostenlos und kann es sein Einfach zu verwenden. Das größte Merkmal von Bulma ist, dass es leichtgewichtig, abhängigkeitsfrei, einfach und benutzerfreundlich ist. Auch wenn Sie kein CSS verstehen. Sie können ganz einfach schöne Webseiten erstellen.

Weitere Details: http://www.sevdot.com/articles/7

Foundation

Github-Staranzahl 28,6K.

GitHub-Adresse: https://github.com/zurb/foundation-sites

Foundation wird zur Entwicklung responsiver HTML-, CSS- und JavaScript-Frameworks verwendet.

Foundation ist ein benutzerfreundliches, leistungsstarkes und flexibles Framework zum Erstellen von Webanwendungen auf jedem Gerät.

Foundation ist ein beliebtes Mobile-First-Framework.

Rein

Github-Sterneanzahl 20,8K.

GitHub-Adresse: https://github.com/pure-css/pure

Eine Reihe leichter, reaktionsfähiger reiner CSS-Module von Yahoo, die für jedes Webprojekt geeignet sind.

Pure ist unglaublich klein, komprimiert in einer GZIP-Datei von nur 3,7 KB*. Wir sind bestrebt, jede Codezeile maximal zu optimieren, um die CSS-Größe so weit wie möglich zu komprimieren, was der mobilen Webproduktion zuträglicher ist. Wenn Sie nur einige seiner Module verwenden, ist CSS zu klein, um Freunde zu haben!

Layui

Github-Sterneanzahl 21,5K.

GitHub-Adresse: https://github.com/sentsin/layui

Layui ist ein emotionales Front-End-UI-Framework, das mit seinen eigenen Modulspezifikationen geschrieben wurde und nativem HTML/CSS/JS folgt Schreib- und Organisationsformen sind sehr niedrigschwellig und sofort einsetzbar. Von außen ist es minimalistisch, aber innen ist es leicht und reich an Komponenten. Jedes Detail, vom Kerncode bis zur API, ist sehr gut für die schnelle Schnittstellenentwicklung geeignet.

Uikit

Github-Sterneanzahl 13,5K.

UIkit ist ein leichtes, modulares Front-End-Framework, das vom YOOtheme-Team entwickelt wurde und schnell eine leistungsstarke Web-Front-End-Schnittstelle erstellen kann. UIKit bietet eine umfassende Palette an HTML-, CSS- und JS-Komponenten, die einfach zu verwenden, leicht anzupassen und zu erweitern sind.

Es wurde auf Basis von LESS entwickelt. Die Codestruktur ist klar und einfach, leicht zu erweitern und zu warten und verfügt über kleine und reaktionsfähige Komponenten. Sie können basierend auf dem grundlegenden UIKit-Stil ganz einfach anpassen und erstellen . Themenstil.

Amaze UI

Github-Sterneanzahl 13,4K.

GitHub-Adresse: https://github.com/amazeui/amazeui

Amaze UI basiert auf dem Konzept von Mobile First (Mobile First) und wird schrittweise von kleinen Bildschirmen auf große Bildschirme erweitert. und schließlich die Realisierung aller Bildschirme. Anpassung und Anpassung an den Trend des mobilen Internets.

Amaze UI enthält fast 20 CSS-Komponenten, mehr als 20 JS-Komponenten und mehrere Webkomponenten mit unterschiedlichen Themen. Es kann schnell bildschirmübergreifende Seiten mit hervorragender Benutzeroberfläche und hervorragendem Erlebnis erstellen und so die Entwicklungseffizienz erheblich verbessern.

Im Vergleich zu ausländischen Frameworks konzentriert sich Amaze UI auf den chinesischen Schriftsatz und passt Schriftarten entsprechend dem Benutzeragenten an, um unter Berücksichtigung der Kompatibilitätsunterstützung inländischer Mainstream-Browser und des integrierten Browsers bessere chinesische Schriftsatzeffekte zu erzielen App.

Amaze UI wurde für HTML5 entwickelt und verwendet CSS3 für animierte Interaktion. Es ist reibungslos und effizient, besser für mobile Geräte geeignet und ermöglicht ein schnelleres Laden von Webanwendungen.

jQuery-Benutzeroberfläche

Github-Sterneanzahl 10,8K.

GitHub-Adresse: https://github.com/jquery/jquery-ui

jQuery UI ist eine Reihe von Benutzeroberflächeninteraktionen, Spezialeffekten, Widgets und Themen, die auf der jQuery-JavaScript-Bibliothek basieren . Egal, ob Sie eine hochgradig interaktive Webanwendung erstellen oder einfach nur eine Datumsauswahl zu einem Formularsteuerelement hinzufügen, jQuery UI ist die perfekte Wahl.

Die jQuery-Benutzeroberfläche enthält viele Widgets, die den Status verwalten, sodass sie sich geringfügig vom typischen Verwendungsmuster für jQuery-Plug-ins unterscheidet. Alle jQueryUI-Widgets verwenden dasselbe Muster. Sobald Sie also gelernt haben, eines zu verwenden, wissen Sie, wie Sie die anderen verwenden.

Das obige ist der detaillierte Inhalt vonTop 10 der beliebtesten CSS-Frameworks. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:zhihu.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel:42 gängige CSS-TippsNächster Artikel:42 gängige CSS-Tipps