QCM sur Bootstrap – Partie 6

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 est utilisée pour créer un fond sombre avec une couleur de texte claire ?

A .bg-dark .text-light

B .bg-dark .text-white

C .dark-bg .light-text

D .dark-text .bg-light

B
La classe .bg-dark applique un fond sombre à un élément, et la classe .text-white applique une couleur de texte blanche. Ensemble, ces classes créent un contraste élevé, ce qui est utile pour la lisibilité.
 

 

 

2. Quelle classe Bootstrap permet de créer une icône de chargement animée ?

A .spinner

B .spinner-grow

C .loading-icon

D .icon-loading

B
La classe .spinner-grow est utilisée pour créer un indicateur de chargement animé en forme de cercle qui grandit et rétrécit. Il peut être utilisé pour montrer qu’un processus de chargement est en cours.
 

 

 

3. Quelle classe Bootstrap est utilisée pour définir une colonne qui occupe une largeur de 4/12 de la grille ?

A .col-4

B .col-md-4

C .col-lg-4

D .col-3

A
La classe .col-4 fait partie du système de grille de Bootstrap et définit une colonne qui occupe 4 unités sur 12 dans une ligne, soit un tiers de la largeur totale. Bootstrap divise la largeur en 12 unités égales.
 

 

 
 

4. Quelle classe Bootstrap permet de créer un conteneur qui se redimensionne automatiquement selon la taille de l’écran ?

A .container-fluid

B .container-auto

C .responsive-container

D .container-expand

A
La classe .container-fluid crée un conteneur qui occupe toute la largeur de l’écran, peu importe la taille de l’écran. Contrairement à .container, qui a une largeur fixe selon les points de rupture du responsive design, .container-fluid est toujours fluide.

 

 

5. Quelle classe Bootstrap permet de définir une police de texte en gras ?

A .font-bold

B .fw-bold

C .bold-text

D .text-bold

B
La classe .fw-bold permet de définir un texte en gras. Cela fait partie des utilitaires typographiques de Bootstrap, qui incluent des classes comme .fw-light pour un texte plus léger ou .fw-normal pour un poids de police normal.

 

 

6. Quelle classe Bootstrap permet d’empêcher le défilement horizontal d’une page ?

A .overflow-hidden

B .no-scroll

C .scroll-x-none

D .overflow-auto

A
La classe .overflow-hidden empêche l’affichage de la barre de défilement horizontale ou verticale lorsque le contenu déborde de l’élément. C’est utile pour éviter des barres de défilement non souhaitées dans certaines zones de la page.

 

 
 

7. Quelle classe Bootstrap est utilisée pour ajouter un fond gris clair à un élément ?

A .bg-soft

B .bg-gray

C .bg-light

D .bg-muted

C
La classe .bg-light est utilisée pour appliquer un fond gris clair (clairement visible dans le thème Bootstrap) à un élément. Elle est couramment utilisée pour les éléments qui nécessitent un fond neutre mais visible.
 

 

 

8. Quelle classe Bootstrap permet de rendre un bouton plus large ?


A .btn-lg

B .btn-expand

C .btn-wide

D .btn-block

A
La classe .btn-lg est utilisée pour agrandir un bouton. Elle est souvent utilisée pour rendre un bouton plus visible et plus accessible sur les pages ou les formulaires. Il existe aussi .btn-sm pour un bouton plus petit.

 

 

9. Quelle classe Bootstrap permet de créer une liste de liens horizontaux ?

A .list-links

B .horizontal-list

C .inline-list

D .list-inline

D
La classe .list-inline permet d’afficher une liste d’éléments (comme des liens) horizontalement au lieu de la disposition verticale par défaut. Elle est très utile pour créer des menus de navigation simples.
 

 

 
 

10. Quelle classe Bootstrap permet de créer un formulaire avec un alignement en ligne ?


A .form-inline

B .form-horizontal

C .form-row

D .inline-form

A
La classe .form-inline permet de disposer les éléments d’un formulaire (comme les champs de saisie, les boutons, etc.) sur la même ligne, plutôt que sur plusieurs lignes. Elle est souvent utilisée pour créer des formulaires compacts.

 

 

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *