Maison >interface Web >Tutoriel d'amorçage >Comment référencer bootstrap en HTML
Comment référencer bootstrap en HTML
- 藏色散人original
- 2020-11-18 10:28:097492parcourir
Comment référencer bootstrap en html : 1. Utilisez la méthode "link rel" pour référencer bootstrap en ligne ; 2. Téléchargez Bootstrap localement, placez les fichiers requis sous le projet, puis introduisez-le dans le fichier correspondant. .
Recommandé : "Tutoriel vidéo bootstrap"
Introduction à Bootstrap
Il existe généralement deux façons d'utiliser Bootstrap :
en faisant référence au style Bootstrap en ligne,
en téléchargeant Bootstrap localement pour référence.
Citation en ligne
Le modèle de base est le suivant :
<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>Avantages : Il n'est pas nécessaire d'installer Bootstrap localement, et il n'est pas nécessaire prendre en compte le problème de chemin lors de la citation
Inconvénients : Une fois le style en ligne baissé, cela affectera le rendu du style de la page entière
Référence locale
Téléchargez Bootstrap localement.
Accédez directement aux 3 URL dans le code ci-dessus pour obtenir le code
Allez sur le site officiel de Bootstrap http://v3.bootcss.com/ et celui de JQuery
site officiel http://jquery.com/ Téléchargez les fichiers correspondants
Placez les fichiers requis sous le projet pour une référence facile
La structure des répertoires de bootstrap est la suivante :
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.woff2Les plus couramment utilisés sont css/bootstrap.min.css, js/bootstrap.min.js
jquery.min.js peut être téléchargé depuis le site officiel de JQuery
Enfin, il suffit de l'introduire dans le fichier correspondant.
Avantages : assurez-vous que le style de page peut toujours être affiché normalement même si l'état du réseau est mauvais
Inconvénients : il doit être installé ou téléchargé à l'avance, et les problèmes de chemin doivent être pris en compte lors référencement.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!