Toolkit: Ein leistungsfähigeres Front-End-Framework als Bootstrap

Toolkit: Ein leistungsfähigeres Front-End-Framework als Bootstrap

Power-Frontrahmen-Werkzeugsatz-1

Hinweis: Die derzeit beliebtesten Front-End-Frameworks sind Bootstrap und Foundation. Beide verfügen über häufig verwendete Webdesign-Komponenten und sind mit Mobilgeräten kompatibel. Sie sind bei der Öffentlichkeit sehr beliebt. Wenn Sie jedoch der Meinung sind, dass die Komponenten dieser beiden Frameworks immer noch nicht ausreichen, können Sie das heute freigegebene Toolkit ausprobieren. Es verfügt über mehr integrierte UI-Komponenten, die leistungsfähiger, praktischer und beliebter sind.

Toolkit: Ein Front-End-Framework mit praktischeren UI-Komponenten als Bootstrap

Das Tookit-Framework zeichnet sich durch ein flaches Design und viele neue UI-Komponenten aus. In Kombination mit CSS3-Animationen werden viele Komponenteninteraktionen ansprechend und leistungsstark.

Hier sind einige Screenshots:

Werkzeug

Eingabeaufforderung zum Hervorheben von Text

Toolkit Front-End-Framework

Tooltips

Nr.

Komponente für schnelle Informationen (Abbildung: untere linke Ecke)

Es gibt einen Animationseffekt, der auf Englisch Toast heißt. Sie können auf der offiziellen Website die aktuelle DEMO ansehen.

Navigation und Positionierung

Wie in der folgenden Abbildung gezeigt, wird beim Anzeigen des E-Bereichs auf der Seite das E in der rechten Navigation hervorgehoben, ähnlich wie der Kontakteffekt auf einem bestimmten Mobiltelefon.

Schritt

Start-Taste

Akkordeon

Bilddarstellung

Prozessfortschrittsbalken

Gleitender Seitenleisteneffekt (Off Canvas)

Flusslayout

Laden…

Technologie zum verzögerten Laden von Bildern

Nun, es gibt zu viele, um sie aufzulisten. Klicken Sie bitte auf den Link unten, um zur offiziellen Website zu gelangen und die tatsächliche Wirkung zu sehen:)

Generell finde ich, dass die Schnittstellen von Bootstrap und Foundation ansprechender sind, aber da es sich um flache Designs handelt, sind auch Änderungen sehr einfach.

<<:  Verwenden Sie CSS3, um den Code für dynamische Spezialeffekte beim Hovern von Schaltflächen zu implementieren

>>:  Serviceverwaltung der Quellpaketinstallation unter Linux

Artikel empfehlen

So konfigurieren Sie den Runner-Container in Docker

1. Erstellen Sie einen Runner-Container mk@mk-pc:...

Methoden und Techniken zum schnellen Anzeigen von Webseitenbildern

1. Verwenden Sie .gifs statt .jpgs. GIFs sind im ...

Parsen des Linux-Quellcodes epoll

Inhaltsverzeichnis 1. Einleitung 2. Einfaches Epo...

Eine kurze Erläuterung des Lazy-Loading-Attributmusters in JavaScript

Inhaltsverzeichnis 1. Einleitung 2. On-Demand-Att...

Grafisches Tutorial zur Installation der 64-Bit-Desktopversion von Centos 7

Wenn Sie der Meinung sind, dass das System langsa...

So implementieren Sie einen variablen Ausdrucksselektor in Vue

Inhaltsverzeichnis Definieren der HTML-Struktur E...

Die Magie des tr-Befehls beim Zählen der Häufigkeit englischer Wörter

Wir alle kennen den Befehl tr, mit dem Ersetzunge...

Vergleich der JS-Array-Loop-Methode und der Effizienzanalyse

Array-Methoden JavaScript bietet viele Array-Meth...