Défi et Quiz : Configuration de Bootstrap
Remarque
Tous les défis suivront le même format que celui présenté ci-dessous :
- Une tâche à accomplir vous sera présentée ;
- Ensuite, vous trouverez un bloc de code dans lequel vous devrez effectuer des modifications selon la tâche ;
- Cliquez sur le bouton Exécuter le code pour prévisualiser la page en direct ;
- Sous le bloc de code, deux boutons seront disponibles : Indice et Solution ;
- Le bouton Indice fournit des indications pour la tâche ;
- Le bouton Solution affiche la solution correcte.
- Il est recommandé d'essayer de réaliser la tâche par vous-même avant d'utiliser le bouton Solution.
Tâche
Un code HTML de base vous est fourni, comprenant un élément button actuellement stylisé avec les styles par défaut du navigateur. Bien que l’élément button comporte des noms de classes issus de Bootstrap, aucun changement n’est visible sur la page en direct car Bootstrap n’a pas encore été intégré au projet. Votre tâche consiste à ajouter les liens appropriés pour connecter Bootstrap au projet.
index.html
- Pour ajouter le lien vers le CSS de Bootstrap, utilisez le code suivant :
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">. - Pour le lien JavaScript de Bootstrap, utilisez ce code :
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>.
index.html
Quiz
1. Quelle est l'une des méthodes pour intégrer Bootstrap dans un projet ?
2. Que signifie CDN dans le contexte de l'intégration de Bootstrap ?
3. Quelle commande permet d’installer Bootstrap via NPM ?
Merci pour vos commentaires !
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Can you explain where exactly I should place the Bootstrap links in the HTML file?
Do I need to add both the CSS and JavaScript links for Bootstrap to work?
What changes should I expect to see after adding Bootstrap to the project?
Awesome!
Completion rate improved to 3.23
Défi et Quiz : Configuration de Bootstrap
Glissez pour afficher le menu
Remarque
Tous les défis suivront le même format que celui présenté ci-dessous :
- Une tâche à accomplir vous sera présentée ;
- Ensuite, vous trouverez un bloc de code dans lequel vous devrez effectuer des modifications selon la tâche ;
- Cliquez sur le bouton Exécuter le code pour prévisualiser la page en direct ;
- Sous le bloc de code, deux boutons seront disponibles : Indice et Solution ;
- Le bouton Indice fournit des indications pour la tâche ;
- Le bouton Solution affiche la solution correcte.
- Il est recommandé d'essayer de réaliser la tâche par vous-même avant d'utiliser le bouton Solution.
Tâche
Un code HTML de base vous est fourni, comprenant un élément button actuellement stylisé avec les styles par défaut du navigateur. Bien que l’élément button comporte des noms de classes issus de Bootstrap, aucun changement n’est visible sur la page en direct car Bootstrap n’a pas encore été intégré au projet. Votre tâche consiste à ajouter les liens appropriés pour connecter Bootstrap au projet.
index.html
- Pour ajouter le lien vers le CSS de Bootstrap, utilisez le code suivant :
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">. - Pour le lien JavaScript de Bootstrap, utilisez ce code :
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>.
index.html
Quiz
1. Quelle est l'une des méthodes pour intégrer Bootstrap dans un projet ?
2. Que signifie CDN dans le contexte de l'intégration de Bootstrap ?
3. Quelle commande permet d’installer Bootstrap via NPM ?
Merci pour vos commentaires !