Comment introduire le bootstrap-js tutoriel-php.cn

Comment introduire le bootstrap

藏色散人

Libérer： 2019-06-01 10:13:58

original

7641 Les gens l'ont consulté

Comment introduire le bootstrap

Il existe généralement deux façons d'utiliser Bootstrap :

Référez-vous au style Bootstrap en ligne,

Téléchargez Bootstrap vers la référence localement.

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>

Copier après la connexion

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 désactivé, 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.woff2

Copier après la connexion

Les 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 dans de mauvaises conditions de réseau

Inconvénients : il doit être installé ou téléchargé à l'avance, et les problèmes de chemin doivent être pris en compte lors de la citation.

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!