Heim > Web-Frontend > Bootstrap-Tutorial > So führen Sie Code in Bootstrap ein

So führen Sie Code in Bootstrap ein

下次还敢
Freigeben: 2024-04-05 02:51:16
Original
1006 Leute haben es durchsucht

Um Bootstrap-Code einzuführen, gibt es drei Möglichkeiten: Verwendung eines CDN, Herunterladen einer Datei oder Verwendung eines Paketmanagers. Dateien können schnell über ein CDN aus dem Web abgerufen, lokal durch Herunterladen verfügbar gemacht oder über die Befehlszeile über einen Paketmanager installiert werden.

So führen Sie Code in Bootstrap ein

So führen Sie Bootstrap-Code ein

Bootstrap ist ein beliebtes CSS-Framework zum Erstellen reaktionsfähiger, für Mobilgeräte optimierter Websites und Anwendungen. Um Bootstrap-Code einzuführen, können Sie dies auf folgende Weise tun:

1. Verwenden eines CDN

Am einfachsten ist es, ein Content Delivery Network (CDN) zum Hosten der Bootstrap-Dateien zu verwenden. Ein CDN ist ein weltweit verteiltes Netzwerk von Servern, das statische Dateien wie CSS und JavaScript schnell und effizient bereitstellt.

Hier sind die Schritte zum Laden von Bootstrap von einem CDN:

  • Fügen Sie im <head>-Tag des HTML-Dokuments die folgende Zeile hinzu: <head> 标签中,添加以下行:

    <code class="html"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"></code>
    Nach dem Login kopieren
  • 对于 JavaScript,添加:

    <code class="html"><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script></code>
    Nach dem Login kopieren

2. 下载 Bootstrap 文件

您还可以从 Bootstrap 官方网站下载 Bootstrap 文件。下载后,将文件复制到您网站的目录中。

  • 对于 CSS,将文件命名为 "bootstrap.min.css" 并将其放置在 <style> 标签中:

    <code class="html"><link rel="stylesheet" href="css/bootstrap.min.css"></code>
    Nach dem Login kopieren
  • 对于 JavaScript,将文件命名为 "bootstrap.bundle.min.js" 并将其放置在 <script>

    <code class="html"><script src="js/bootstrap.bundle.min.js"></script></code>
    Nach dem Login kopieren
Für JavaScript fügen Sie hinzu :

<code>npm install bootstrap</code>
Nach dem Login kopieren

2. Laden Sie die Bootstrap-Datei herunter

Sie können die Bootstrap-Datei auch von der offiziellen Bootstrap-Website herunterladen. Kopieren Sie die Datei nach dem Herunterladen in das Verzeichnis Ihrer Website.
  • Für CSS nennen Sie die Datei „bootstrap.min.css“ und platzieren Sie sie im <style>-Tag:
  • rrreee
🎜🎜Für JavaScript nennen Sie die Datei „bootstrap.bundle“. .min.js“ und platzieren Sie es im <script>-Tag: 🎜rrreee🎜🎜🎜🎜3. Verwenden Sie einen Paketmanager 🎜🎜🎜, wenn Sie einen Paketmanager wie Node Package verwenden Manager (npm) können Sie Bootstrap mit dem folgenden Befehl installieren: 🎜rrreee🎜Nach der Installation können Sie den folgenden Code in Ihrem Projekt verwenden: 🎜🎜🎜Für CSS importieren Sie „bootstrap/dist/css/bootstrap.min. css“ . 🎜🎜Für JavaScript importieren Sie „bootstrap/dist/js/bootstrap.bundle.min.js“. 🎜🎜

Das obige ist der detaillierte Inhalt vonSo führen Sie Code in Bootstrap ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage