Heim > Artikel > Web-Frontend > So führen Sie Bootstrap ein
So führen Sie Bootstrap ein
- 藏色散人Original
- 2019-06-01 10:13:587530Durchsuche
Es gibt im Allgemeinen zwei Möglichkeiten, Bootstrap zu verwenden:
Beziehen Sie sich auf den Online-Bootstrap-Stil,
Laden Sie Bootstrap als Referenz herunter vor Ort.
Online-Zitat
Die Grundvorlage lautet wie folgt:
<html>
<head>
<meta charset="UTF-8">
<title>Bootstrap引入</title>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
</head>Vorteile: Bootstrap muss nicht lokal installiert werden und ist auch nicht erforderlich Berücksichtigung des Pfadproblems beim Zitieren
Nachteile: Sobald der Online-Stil deaktiviert ist, wirkt sich dies auf die Darstellung des gesamten Seitenstils aus
Lokale Referenz
Laden Sie Bootstrap lokal herunter.
Greifen Sie direkt auf die drei URLs im obigen Code zu, um den Code zu erhalten.
Gehen Sie zur offiziellen Website von Bootstrap http://v3.bootcss.com/ und zu JQuery
offizielle Website http://jquery.com/ Laden Sie die entsprechenden Dateien herunter
Platzieren Sie die erforderlichen Dateien zum einfachen Nachschlagen unter dem Projekt
Die Verzeichnisstruktur von Bootstrap ist wie folgt:
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ ├── bootstrap.min.css.map
│ ├── bootstrap-theme.css
│ ├── bootstrap-theme.css.map
│ ├── bootstrap-theme.min.css
│ └── bootstrap-theme.min.css.map
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
├── glyphicons-halflings-regular.woff
└── glyphicons-halflings-regular.woff2Die am häufigsten verwendeten sind css/bootstrap.min.css, js/bootstrap.min.js
jquery.min.js kann von der offiziellen JQuery-Website heruntergeladen werden
Schließlich Fügen Sie es einfach in die entsprechende Datei ein.
Vorteile: Stellen Sie sicher, dass der Seitenstil auch bei schlechten Netzwerkbedingungen weiterhin normal angezeigt werden kann
Nachteile: Es muss im Voraus installiert oder heruntergeladen werden und Pfadprobleme müssen berücksichtigt werden Referenzierung.
Das obige ist der detaillierte Inhalt vonSo führen Sie Bootstrap ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!