Inhaltsverzeichnis
Es ist ein Rahmen zur Förderung der Konsistenz durch interne Tools. Vor Bootstrap wurden verschiedene Bibliotheken für die Entwicklung von Benutzeroberflächen verwendet, was zu Inkonsistenzen und einem hohen Wartungsaufwand führte.
Bootstrap ist modular aufgebaut und besteht im Wesentlichen aus einer Reihe von Stylesheets, die die verschiedenen Komponenten des Tools implementieren. Ein Stylesheet namens bootstrap.less enthält die Stylesheet-Komponenten. Entwickler können dieselbe Bootstrap-Datei anpassen und die Komponenten auswählen, die sie in ihrem Projekt verwenden möchten.
In Bootstrap verfügbare Tools und Klassen
Gangsystem und responsives Design
Bootstrap wird mit einem standardmäßigen 940 Pixel breiten Rasterlayout geliefert. Alternativ kann der Entwickler ein Layout mit variabler Breite verwenden. Dadurch wird die Breite der Spalten automatisch angepasst.
Das CSS-Stylesheet
Bootstrap bietet eine Reihe von Stylesheets, die grundlegende Stildefinitionen für alle HTML-Komponenten bereitstellen. Dies vereinheitlicht den Browser und das Breitensystem, gibt ein modernes Erscheinungsbild für die Formatierung von Textelementen, Tabellen und Formularen.
Wiederverwendbare Komponenten
Die regulären HTML-Elemente Bootstrap enthält eine weitere häufig verwendete Elementschnittstelle. Es enthält Schaltflächen mit erweiterten Funktionen wie Schaltflächengruppen oder Schaltflächen mit Dropdown-Menüoption, Navigationslisten, horizontale und vertikale Beschriftungen, Breadcrumb, Paginierung, Beschriftungen, erweiterte typografische Miniaturansichten, Warnmeldungsformate und Fortschrittsbalken.
Javascript- und jQuery-Plugins
Die Javascript-Komponenten für Bootstrap basieren auf der jQuery-JavaScript-Bibliothek. Die Plug-ins finden Sie im jQuery-Plug-in-Tool. Sie bieten zusätzliche Elemente der Benutzeroberfläche wie Dialoge, QuickInfos und Karussells.
Sie erweitern auch die Funktionalität einiger vorhandener Oberflächenelemente, darunter beispielsweise eine Autovervollständigungsfunktion für Eingabefelder. Version 2.0 unterstützt die folgenden Javascript-Plug-Ins: Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Carousel und Typeahead.
Um Bootstrap in einer HTML-Seite zu verwenden, muss der Entwickler nur das Bootstrap-CSS-Stylesheet herunterladen und in der HTML-Datei verlinken.
Laden Sie den kompilierten CSS- und Javascript-Code herunter. Dies ist der einfachste Weg, um mit Bootstrap zu beginnen. Der Nachteil ist, dass diese Version weder die Originaldateien noch die Dokumentation enthält. Um diese Version herunterzuladen, gehen Sie zu getbootstrap.com und klicken Sie auf die Schaltfläche Bootstrap herunterladen.
Wir können auch wie folgt auf die Bootstrap-Dateien von externen Servern verlinken:
Um diese Dateien zu verwenden, ändern Sie die folgenden Links auf Ihren Seiten
Nach dem Entpacken der Datei, die Sie mit der kompilierten Version von Bootstrap heruntergeladen haben, sehen Sie die folgende Datei- und Verzeichnisstruktur:
Bootstrap /
CSS /
├── bootstrap.css
├── bootstrap.min.css
├── bootstrap-theme.css
│ └── bootstrap-theme.min.css
├── js /
├── bootstrap.js
└── bootstrap.min.js
└── Schriftarten /
glyphicons-halflings-regular.eot
glyphicons-halflings-regular.svg
glyphicons-halflings-regular.ttf
glyphicons-halflings-regular.woff
Diese Dateien sind die Bibliotheken, aus denen Bootstrap besteht. Später werden wir die Komponenten und ihre Verwendung sehen.Hat dir dieses Tutorial gefallen und geholfen?Sie können den Autor belohnen, indem Sie diesen Knopf drücken, um ihm einen positiven Punkt zu geben
