Bootstrap ist ein CSS -Framework, das für die Erstellung reaktionsschneller Websites und insbesondere für Websites entwickelt wurde, die für Mobiltelefonen entwickelt wurden, bevor sie für einen anderen Gerätetyp ausgelegt sind. Dieses Framework wurde unter Verwendung von HTML, CSS und JavaScript entwickelt und besteht aus Vorlagen zum Erstellen verschiedener Elemente wie Schaltflächen, Formen, Dropdowns und vieler mehr. Darüber hinaus ist dieses Framework Open Source und auch frei zu verwenden.

Wie der Titel des Artikels schon sagt, liegt hier der Schwerpunkt unserer Diskussion Bootstrap 5. Daher fangen wir ohne weiteres an.

Was ist Bootstrap 5?

Bootstrap 5 ist die neueste Version des Bootstrap -Frameworks, mit der seine Benutzer erstaunliche Websites mit schnellen CSS -Stylesheets und verbesserten Reaktionsfähigkeit erstellen können. Es wurde im Jahr 2021 eingeführt und wird von fast allen Browsern und Plattformen unterstützt. \

Merkmale von Bootstrap

Einige der Unterscheidungsmerkmale von Bootstrap 5 sind wie folgt.

1. Diese neueste Version von Bootstrap ist leicht und kann entsprechend den Anforderungen der Benutzer angepasst werden.
2. Es besteht aus einer verbesserten Reaktionsfähigkeit.
3. Es ist nützlich, um Websites zu entwickeln, die zuerst für Mobiltelefone und andere Geräte konzipiert sind.
4. Dieses Framework ist mit allen modernen Browsern kompatibel.
5. Es ist schneller und spart viel Zeit und Energie.

Bootstrap 5 vs. Andere Versionen

Im Vergleich zu anderen Versionen, insbesondere Version 3, und Version 4. Die älteren Versionen können jedoch weiterhin zur Behebung oder Änderung der Dokumentation verwendet werden.

Nachdem wir nun eine grundlegende Einführung des Bootstrap 5 haben, erstellen wir unsere erste Webseite mit diesem Framework.

Mein erstes Bootstrap5 -Programm

Zum Zwecke der Verwendung von Bootstrap 5 müssen Sie es offensichtlich zuerst installieren. Sie können dieses Framework entweder aus dem Inhaltszustellungsnetzwerk einfügen oder ihn herunterladen und aus Bootstrap installieren.com. Der erste Ansatz wird bevorzugt, wenn Sie Bootstrap 5 nicht hosten möchten. Unten haben wir das CDN von Bootstrap 5 gegeben.

Für CSS

Für JavaScript

Nachdem wir unsere CDN haben, lassen Sie uns eine Webseite mit Bootstrap 5 erstellen. Im Folgenden haben wir eine Schritt-für-Schritt-Anleitung zur Verfügung gestellt.

Schritt 1
Der erste Schritt zur Verwendung von Bootstrap 5 besteht darin, HTML5 -DocType so einzuschließen, dass Bootstrap 5 verschiedene HTML -Elemente und CSS -Eigenschaften vollständig verwenden kann.

>

Neben HTML5 docType haben wir auch das Lang -Attribut zusammen mit einem Zeichensatz aufgenommen.

Schritt 2
Wie wir wissen, entwickelt Bootstrap 5 eine Website mit einem mobilen Ansatz. Daher besteht der nächste Schritt darin, ein reaktionsschnelles Meta-Tag hinzuzufügen, um sicherzustellen.

Fügen Sie das folgende Tag ein.

Schritt 3
Eine grundlegende Notwendigkeit von Bootstrap 5 besteht darin, einen Container zum Wickeln des Inhalts der Website aufzunehmen. Diese Behälter wickeln im Grunde genommen Elemente in sich. Um diese Container zu verwenden, verwenden Sie die folgenden zwei Klassen.

1. .Container Um einen Container mit fester Breite zu bauen und dennoch reaktionsschnell.
2. .Containerfluid Um einen Container mit voller Breite zu erstellen, der über die gesamte Ansichtsfensterbreite verfügt.

Schritt 4
Für diesen Schritt werden wir einige Inhalte hinzufügen, um unsere Webseite mit dem Container fester Breite zu erstellen. Wir halten unser Programm sehr einfach, damit es als Anfänger leicht zu verstehen ist, dass Bootstrap 5 ist.

Bootstrap 5

Bootstrap 5 ist die neueste Version des Bootstrap -Frameworks, mit dem der Benutzer erstaunliche Websites mit schnellem CSS erstellen lässt
Stylesheets und verbesserte Reaktionsfähigkeit.

Im Vergleich zu anderen Versionen speziell Version 3 und Version 4 verwendet Bootstrap 5 Vanille -JavaScript anstelle
JQuery.

Im obigen Code haben wir mit der Containerklasse ein Div -Element erstellt, das eine Überschrift weiter nistet, und zwei Absätze. Um den vollständigen Effekt von Bootstrap 5 zu sehen, die Größe Ihres Browserfensters ändern. In der folgenden Ausgabe haben wir Ihnen gezeigt, wie die Seite zufällige Bildschirmgrößen ansieht.

Ausgang
Wenn die Bildschirmbreite 837px und höher beträgt.

Wenn die Bildschirmbreite 677px und weniger beträgt.

Eine Webseite wurde erfolgreich mit Bootstrap 5 erstellt.

Abschluss

Bootstrap 5 ist die neueste Version des CSS-Bootstrap-Frameworks, mit dem die Benutzer Websites erstellen können, die in der Natur reagieren. Diese Version verfügt über schnelle Stylesheets und eine verbesserte Reaktionsfähigkeit und wurde 2021 gestartet. Es hat viele erstaunliche Funktionen, die es von anderen Versionen unterscheiden. Im Vergleich zu anderen Versionen, insbesondere Version 3, und Version 4. Dieses Tutorial behandelt alle erforderlichen Details zu Bootstrap 5 zusammen mit einem einfachen Programm.