Chinesisches Bootstrap-Handbuch

Bootstrap ist das beliebteste und leistungsstärkste Front-End-Framework (HTML, CSS und JavaScript), das die reaktionsfähige (adaptive) Webentwicklung schneller und einfacher macht.

Einführung in Bootstrap

Bootstrap wurde ursprünglich Mitte der 2010er Jahre von Designern und Entwicklern bei Twitter entwickelt. Bevor es zu einem Open-Source-Framework wurde, war Bootstrap als Twitter Blueprint bekannt.

Bootstrap ist ein leistungsstarkes Front-End-Framework, das die Webentwicklung schneller und einfacher macht. Es enthält HTML- und CSS-basierte Designvorlagen zum Erstellen allgemeiner Benutzeroberflächenkomponenten wie Formulare, Schaltflächen, Navigation, Dropdown-Menüs, Warnungen, Modalitäten, Registerkarten, Akkordeons, Karussells, Tooltips und mehr.

Die Verwendung von Bootstrap kann viel Zeit und Mühe sparen.

Hinweis: Standardmäßig reagiert Bootstrap 4 und verfolgt einen Mobile-First-Ansatz. Bootstrap 4.3 ist die neueste und stabilste Version von Bootstrap. Bootstrap 4 wird von allen wichtigen modernen Browsern wie Google Chrome, Firefox, Safari, Internet Explorer 10 und höher usw. unterstützt.

Was Sie mit Bootstrap machen können

• Mit Bootstrap können Sie mehr machen.

• Sie können ganz einfach eine responsive Website erstellen.

• Mit vordefinierten Klassen können Sie schnell mehrspaltige Layouts erstellen.

• Sie können schnell verschiedene Arten von Formularlayouts erstellen.

• Sie können schnell verschiedene Variationen der Navigationsleiste erstellen.

• Sie können problemlos Komponenten wie Akkordeons, Modalitäten usw. erstellen, ohne JS-Code schreiben zu müssen.

• Sie können ganz einfach dynamische Registerkarten erstellen, um große Mengen an Inhalten zu verwalten.

• Sie können ganz einfach Tooltips und Popups erstellen, um Eingabeaufforderungstext anzuzeigen.

• Sie können ganz einfach Karussells oder Bildschieberegler erstellen, um Ihre Inhalte zu präsentieren.

• Sie können schnell verschiedene Arten von Alarmboxen erstellen.

Tatsächlich ist es viel mehr als das. Mit Bootstrap können Sie viele andere interessante Dinge tun. Mehr dazu erfahren Sie in den folgenden Kapiteln.

Vorteile der Verwendung von Bootstrap

Wenn Sie Erfahrung mit einem Front-End-Framework haben, fragen Sie sich vielleicht, was Bootstrap so besonders macht. Hier sind einige Vorteile, warum Sie sich für das Bootstrap-Framework entscheiden sollten:

• Sparen Sie viel Zeit – Verwenden Sie vordefinierte Bootstrap-Designvorlagen und -Klassen, um viel Zeit und Mühe zu sparen und Fokus für andere Entwicklungsarbeiten.

• Responsive Features – Mit Bootstrap können Sie ganz einfach eine responsive Website erstellen, die auf verschiedenen Geräten und Bildschirmauflösungen besser funktioniert, ohne das Markup zu ändern.

• Konsistentes Design – Alle Bootstrap-Komponenten nutzen über eine zentrale Bibliothek dieselben Designvorlagen und Stile, sodass Design und Layout Ihrer Webseiten konsistent bleiben.

• Einfach zu bedienen - Bootstrap ist sehr einfach zu bedienen. Jeder mit Grundkenntnissen in HTML, CSS und JavaScript kann mit der Entwicklung mit Bootstrap beginnen.

• Kompatible Browser – Bootstrap wurde speziell für moderne Webbrowser entwickelt und ist mit allen modernen Browsern wie Chrome, Firefox, Safari und Internet Explorer kompatibel.

• Open Source – Das Beste daran ist, dass es völlig kostenlos heruntergeladen und verwendet werden kann.

Was dieses Tutorial behandelt

Diese Bootstrap-Tutorialreihe deckt alle Funktionen des Bootstrap-Frameworks ab, beginnend mit den Grundlagen wie Rastersystem, Typografiestilmechanismus und Formularstil Methoden und Techniken zum Gestalten gängiger Benutzeroberflächenelemente wie Tabellen, Listen, Bilder usw.

Darüber hinaus erfahren Sie, wie Sie gebrauchsfertige Bootstrap-Komponenten wie Eingabegruppen, Schaltflächengruppen, Medienobjekte, Navigationsleisten, Panels, Paginierung, Beschriftungen und Abzeichen, Fortschrittsbalken usw. verwenden wie man sie anpasst, um verschiedene Variationen zu erstellen.

Abschließend werden Sie einige erweiterte Funktionen von Bootstrap erkunden, wie das Erstellen modaler Fenster, dynamischer Registerkarten, Tooltips, Warnungen, Akkordeonmenüs, Karussells, Scrollen usw. und wie Sie es mithilfe der verfügbaren Optionen und Methoden anpassen können erweitern ihre bestehende Funktionalität.

Bevor Sie diesen Kurs studieren, lesen Sie bitte

• HTML-Tutorial

• CSS-Tutorial

• JAVASCRIPT-Tutorial