Aller au contenu

Ajouter Bootstrap CDN

Voici le squeltte HTML avec les ajouts nécessaires pour utiliser Bootstrap CDN.

Dernière version de Bootstrap

Aussi disponible sur le site de Bootstrap dans la documentation

Styles de base Bootstrap

<!doctype html>

<html lang="fr">

    <head>
        <meta charset="utf-8">
        <title>TITRE DE LA PAGE</title>
        <meta name="author" content="NOM DE L'AUTEUR">

        <!--Détection de la taille d'affichage-->
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!--CSS Bootstrap 5.3.7-->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr" crossorigin="anonymous">

    </head>

    <body>
        <!-- CONTENU DE LA PAGE -->

    </body>

</html>

Styles de base et icônes Bootstrap

<!doctype html>

<html lang="fr">

    <head>
        <meta charset="utf-8">
        <title>TITRE DE LA PAGE</title>
        <meta name="author" content="NOM DE L'AUTEUR">

        <!--Détection de la taille d'affichage-->
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!--CSS Bootstrap 5.3.7-->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr" crossorigin="anonymous">
        <!--Icônes Bootstrap-->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">

    </head>

    <body>
        <!-- CONTENU DE LA PAGE -->

    </body>

</html>

Styles et fonctionnalités (drop down, carrousel, etc.) de Bootstrap

<!doctype html>

<html lang="fr">

    <head>
        <meta charset="utf-8">
        <title>TITRE DE LA PAGE</title>
        <meta name="author" content="NOM DE L'AUTEUR">

        <!--Détection de la taille d'affichage-->
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!--CSS Bootstrap 5.3.7-->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr" crossorigin="anonymous">

    </head>

    <body>
        <!-- CONTENU DE LA PAGE -->

        <!--Script Bootstrap 5.3.7-->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.bundle.min.js" integrity="sha384-ndDqU0Gzau9qJ1lfW4pNLlhNTkCfHzAVBReH9diLvGRem5+R9g2FzA8ZGN954O5Q" crossorigin="anonymous"></script>
    </body>

</html>