10 leichte Alternativen zu Bootstrap & Foundation
Die Wahl des richtigen Rahmens, der perfekt zu Ihren Projekten passt, könnte etwas überwältigend sein - es gibt sie viel zur Auswahl. Vielleicht möchten Sie mit beliebten Optionen wie Bootstrap oder Foundation arbeiten, aber wenn Ihre Website recht einfach sein wird, Sie werden die meisten Bausteine und Materialien nicht benötigen im Standardpaket enthalten.
Die gute Nachricht ist, dass es eine Handvoll Alternativen gibt, die viel schlanker sind als Bootstrap oder Foundation. Die meisten dieser Frameworks werden mit ausgeliefert genau die richtige Anzahl von Stilen und Komponenten Ihnen den Einstieg erleichtern und gleichzeitig in die gewünschte Richtung für Ihr Projekt ausdehnen können.
Hier sind 10 leichte Alternativen zu Bootstrap und Foundation dass Sie für verwenden sollten Erstellen kleinerer Websites.
Mehr auf Hongkiat.com:
- Erste Schritte mit Twitter Bootstrap
- Bootstrap 3 mit Sass verwenden
- Bootstrap-Tool: Erstellen Sie HTML-Bootstrap-Layouts
- Arbeiten mit dem Bootstrap Plugin: Modal Window
- Bootstrap-Tool: Erstellen Sie Megamenu mit YAMM3
1. Skelett
Skeleton hat endlich ein neues Gesicht bekommen. Es ist eine totale Überarbeitung von Grund auf, und dennoch ist es immer noch so leicht wie früher. Das neue Skeleton-Rastersystem verwendet jetzt die mobile first-Philosophie, die sicherstellt, dass das Layout unabhängig von der Größe des Bildschirms des Geräts im Mittelpunkt steht.
Alle Komponenten, die in der früheren Version enthalten waren - Schaltflächen, Formulare und Eingabeelemente - sind immer noch vorhanden, aber die grundlegenden Typografiestile sind jetzt eingestellt rem Einheit.
2. CardinalCSS
CardinalCSS ist ein CSS-Framework, das auf Leistung, Lesbarkeit und vor allem Wartbarkeit ausgerichtet ist. CardinalCSS verwendet einige moderne Ansätze wie mobile-first, um das Netz aufzubauen. und CSS-Box-Modell, mit dem Sie Elementbreite und -höhe einfach bestimmen können.
CardinalCSS enthält außerdem eine Handvoll Hilfsklassen, mit denen Sie Stile schnell auf ein Element anwenden können, z Mütze Damit wird der Drop-Cap-Effekt für das erste Zeichen im Absatz angewendet.
3. ConciseCSS
ConciseCSS ist ein CSS-Framework - ohne Aufblasen. Es ist ein schlankes Framework, das auf Sass, LESS und Stylus aufgebaut ist und den goldenen Weg für die Wartbarkeit von CSS ebnet. Wenn Sie jedoch einfaches Vanilla-CSS bevorzugen, können Sie dies auch tun.
Ebenso enthält ConciseCSS Basisstile für wichtige Elemente wie Überschriften, Absätze, Tabellen, Formulare und eine Reihe von Hilfsklassen zum Erstellen von Schaltflächen-Benutzeroberflächen.
4. PowertoCSS
PowertoCSS ist leicht und ein solides Frontend-Framework. Klassennamen, die zum Erstellen des Gitters und zum Anwenden von Stilen verwendet werden, sind einfach und leicht zu merken, z. .Taste. Sie können auch Ihr eigenes Thema hinzufügen. Begib dich zu ihrem StarterKit um loszulegen.
5. Verstohlen
Furtive ist ein Mobile-First-CSS-Framework, das auf den führenden Webstandards basiert, wie beispielsweise der Verwendung von Flexbox für das Grid und rem Einheit zur Größenanpassung von Elementen (einschließlich Schriftgröße). Furtive behält einen geringen CSS-Fußabdruck bei, da ältere Browser (* hust * Internet Explorer) nicht unterstützt werden, da dazu CSS-Hacker erforderlich sind. Daher ist Furtive ein perfekter Rahmen, wenn Sie eine Website für die Zukunft gestalten.
6. BassCSS
BassCSS bietet eine einfache Auswahl an Basiselementstilen, Dienstprogrammen, Layouts und Farbstilen in modularer Form zum Erstellen einer responsiven Webanwendung. Die SCSS-Dateien dienen zum einfachen Anpassen des Stils. Sie können mit Typografie, Leerzeichen, Haltepunkten und Oberflächenelementen spielen.
7. Mueller
Mueller ist ein modulares responsives Gittersystem, das auf Sass und Compass basiert. Mit Mueller können Sie das Raster erstellen, indem Sie Klassen direkt zu den HTML-Elementen hinzufügen. Wenn Sie jedoch vorziehen, dass Ihre HTML-Elemente sauber und ordentlich sind, verwenden Sie die Gitter() Funktion. Das Müller-Gitter kann zusammen mit der Masonry-Javascript-Bibliothek verwendet werden, um ein Pinterest-ähnliches Layout zu erstellen.
8. Tuktuk
Tuktuk ist ein sehr eindeutiger Name für ein Framework. Verglichen mit Bootstrap oder Foundation ist Tuktuk viel leichter, da nur die richtige Menge an Komponenten für die Erstellung einer repräsentativen Website einschließlich des Rastersystems, der grundlegenden Gestaltung für Typografie, Tabellen und einiger UI wie Navbar und zur Verfügung steht Modale.
9. Basis
Base basiert auf LESS und Sass und enthält nur die wichtigsten Komponenten zum Erstellen von Websites: das Raster und das grundlegende Design von HTML-Elementen. Base verfügt nicht über Javascript-Komponenten, bietet jedoch eine hervorragende Browserkompatibilität, so dass es auch mit IE7 funktioniert.
10. Toast
Der letzte unserer Liste ist Toast. Über das SCSS-Stylesheet, das im Paket enthalten ist, können Sie mit Toast die Namen der Gitterklassen, die Zwischenräume und sogar die Spaltenbasis leicht konfigurieren. Wenn Sie beispielsweise möchten, dass das Raster eine Spalte mit 9 Basen anstelle von 12 ist, können Sie dies tun. Toast ist ein minimales CSS-Framework mit sehr flexiblen Konfigurationen, die auf Ihre Anforderungen abgestimmt sind.
