Heim  >  Artikel  >  Web-Frontend  >  So führen Sie Bootstrap ein

So führen Sie Bootstrap ein

藏色散人
藏色散人Original
2019-06-01 10:13:587601Durchsuche

So führen Sie Bootstrap ein

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.woff2

Die 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!

Stellungnahme:
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