QCM sur Bootstrap – Partie 8
Vous souhaitez évaluer vos compétences en Bootstrap, le framework CSS le plus utilisé pour créer des sites web réactifs et modernes ? Dans cet article, nous vous proposons un QCM sur Bootstrap pour tester vos connaissances et vous perfectionner dans l’utilisation de ce puissant outil. Que vous soyez débutant ou développeur expérimenté, ce quiz vous aidera à mieux comprendre les concepts clés de Bootstrap, de la grille responsive aux composants avancés. Préparez-vous à améliorer vos compétences en développement web et à maîtriser Bootstrap grâce à ce QCM interactif !
1. Quelle classe Bootstrap permet d’appliquer une bordure de couleur rouge autour d’un élément ?
A .border-red
B .border-danger
C .border-primary
D .border-outline
.border-danger applique une bordure de couleur rouge autour d’un élément. Cette classe est souvent utilisée pour indiquer une erreur ou un problème dans une interface utilisateur.
2. Quelle classe Bootstrap permet de créer un bouton qui prend toute la largeur de son conteneur ?
A .btn-block
B .btn-full
C .btn-expand
D .btn-lg
.btn-block est utilisée pour rendre un bouton qui occupe toute la largeur disponible de son conteneur parent. C’est idéal pour les boutons sur des petits appareils ou des formulaires où on veut que le bouton soit facilement cliquable.
3. Quelle classe Bootstrap permet de créer un formulaire avec des champs espacés uniformément ?
A .form-spacing
B .form-group
C .form-inline
D .form-row
.form-group est utilisée pour ajouter un espacement entre les champs d’un formulaire, créant ainsi un espacement uniforme et une organisation claire des éléments de formulaire.
4. Quelle classe Bootstrap permet de rendre une image carrée tout en la redimensionnant pour tenir dans un conteneur ?
A .img-circle
B .img-fluid
C .img-rounded
D .img-square
.img-fluid rend une image responsive et redimensionnable. Elle s’adapte automatiquement à la taille du conteneur tout en conservant ses proportions. Si vous souhaitez créer une image carrée, vous devez également définir des dimensions spécifiques.
5. Quelle classe Bootstrap permet de modifier l’alignement des éléments dans un conteneur Flex ?
A .align-items-start
B .justify-items-center
C .flex-align-center
D .flex-items-middle
.align-items-start permet d’aligner les éléments flex à l’amont (en haut) du conteneur. Il existe également des classes comme .align-items-center pour centrer verticalement les éléments ou .align-items-end pour les aligner en bas.
6. Quelle classe Bootstrap est utilisée pour masquer un élément à toutes les tailles d’écran ?
A .hidden
B .invisible
C .d-none
D .display-none
.d-none est utilisée pour masquer un élément sur tous les écrans. Elle fait partie des classes utilitaires de Bootstrap pour gérer la visibilité des éléments, et elle peut être combinée avec d’autres classes comme .d-sm-none pour masquer un élément à des points de rupture spécifiques.
7. Quelle classe Bootstrap permet de définir un espacement vertical entre les éléments ?
A .space-vertical
B .mb-3
C .space-top
D .mt-3
.mb-3 est utilisée pour ajouter un espacement (marge) en bas d’un élément. Bootstrap offre plusieurs classes utilitaires pour gérer les marges et les paddings: .mt-3 pour la marge en haut, .mb-3 pour la marge en bas, et ainsi de suite.
8. Quelle classe Bootstrap permet de désactiver un bouton ?
A .btn-disabled
B .btn-off
C .disabled
D .btn:disabled
.disabled est utilisée pour désactiver un bouton dans Bootstrap, ce qui le rend non-cliquable et visuellement grisé. Elle peut être utilisée avec d’autres éléments comme les liens.
9. Quelle classe Bootstrap est utilisée pour définir un fond violet sur un élément ?
A .bg-purple
B .bg-info
C .bg-primary
D .bg-indigo
.bg-indigo applique une couleur de fond violette/indigo à un élément. Bootstrap définit différentes classes de couleur de fond basées sur un thème spécifique, et .bg-indigo en fait partie.
10. Quelle classe Bootstrap permet d’afficher une image avec une bordure ?
A .img-border
B .img-rounded
C .border-img
D .img-thumbnail
.img-thumbnail applique une bordure et un effet d’ombre légère autour d’une image pour la faire ressortir, en la transformant en un élément cliquable qui peut aussi être utilisé pour une galerie d’images. Exemple:
<img class="img-thumbnail border border-primary" src="https://via.placeholder.com/150">
- Questions techniques sur MYSQL
- QCM MySQL Corrigé – Optimisation de requêtes
- QCM Base de données avec correction
- QCM sur PHP
- QCM Symfony
- QCM AngularJS
- QCM React
- QCM HTML / CSS
- QCM Java – Programmation Orientée Objet
- QCM Python
- QCM Cloud Computing
- QCM Framework Spring
- QCM Javascript
- QCM jQuery
- QCM Oracle
- QCM sur GIT – Gestionnaire de version
- QCM Linux – Gestion de processus
- QCM Réseau
- QCM Architecture des ordinateurs
- QCM Securité informatique
- QCM En Informatique Générale
- QCM en C
- QCM en C#
- QCM sur l'algorithmique
- QCM Word
- QCM Excel
- QCM PowerPoint
- QCM Access
