QCM sur Bootstrap – Partie 9

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 de créer une barre de navigation fixe en bas de la page ?

A .fixed-bottom

B .navbar-bottom

C .nav-bottom

D .bottom-navbar

A
La classe .fixed-bottom permet de rendre une barre de navigation ou un autre élément fixe en bas de la page, même lorsque l’utilisateur fait défiler la page vers le bas.
 

 

 

2. Quelle classe Bootstrap permet de définir des colonnes avec une largeur de 8/12 dans une grille ?

A .col-12

B .col-md-8

C .col-lg-8

D .col-8

D
La classe .col-8 permet de définir une colonne qui occupe 8 des 12 unités de largeur disponibles dans le système de grille de Bootstrap. Cela laisse 4 unités pour d’autres colonnes.
 

 

 

3. Quelle classe Bootstrap permet de créer un formulaire avec une disposition à plusieurs colonnes ?

A .form-multicol

B .form-row

C .form-column

D .form-layout

B
La classe .form-row est utilisée pour organiser les éléments d’un formulaire dans une disposition en plusieurs colonnes. Elle est souvent utilisée avec des classes comme .col- pour définir la largeur des colonnes dans une grille.
 

 

 
 

4. Quelle classe Bootstrap permet de créer un bouton de type « lien » ?

A .btn-link

B .btn-url

C .btn-nav

D .btn-anchor

A
La classe .btn-link est utilisée pour créer un bouton qui ressemble à un lien hypertexte. Ce type de bouton n’a pas de fond ni de bordure, mais reste cliquable comme un bouton classique.
 

 

 

5. Quelle classe Bootstrap permet de faire apparaître un élément avec une animation de fondu ?

A .fade-in

B .opacity

C .fade

D .appear

C
La classe .fade est utilisée pour ajouter une animation de fondu à un élément. Cela est souvent utilisé dans des contextes comme des carrousels ou des alertes, où l’élément doit apparaître ou disparaître progressivement.
 

 

 

6. Quelle classe Bootstrap permet de définir un espace entre deux colonnes dans une grille ?

A .gap

B .gutter

C .column-spacing

D .col-gap

B
La classe .gutter est utilisée pour définir un espace entre les colonnes d’une grille Bootstrap. Cela crée un espacement interne entre les colonnes, améliorant ainsi la lisibilité et l’organisation des éléments dans la grille.
 

 

 
 

7. Quelle classe Bootstrap permet de créer une zone de texte avec un effet de bordure grise ?

A .form-control

B .input-grey

C .border-light

D .input-border

A
La classe .form-control est utilisée pour ajouter des bordures et un style de zone de texte standard dans Bootstrap. Elle applique par défaut une bordure grise autour du champ de saisie et permet de styliser les éléments de formulaire de manière uniforme.

 

 

8. Quelle classe Bootstrap permet de créer un conteneur qui a un maximum de largeur et est centré ?

A .container-fluid

B .container

C .center-container

D .fixed-container

B
La classe .container crée un conteneur avec une largeur maximale qui est centrée dans la page. C’est la classe de base pour organiser un contenu de manière responsive dans Bootstrap. Pour une largeur pleine, vous utiliseriez .container-fluid.

 

 

9. Quelle classe Bootstrap permet d’afficher un message d’alerte avec une couleur d’arrière-plan jaune ?

A .alert-warning

B .alert-danger

C .alert-info

D .alert-light

A
La classe .alert-warning est utilisée pour créer une alerte avec une couleur d’arrière-plan jaune, souvent utilisée pour signaler un avertissement ou une information importante qui ne nécessite pas une action immédiate.
 

 

 
 

10. Quelle classe Bootstrap permet d’appliquer un espacement horizontal entre les éléments dans un conteneur Flex ?

A .px-3

B .pl-3

C .pr-3

D .m-3

A
La classe .px-3 ajoute un espacement horizontal (padding gauche et droite) de taille 3 à un élément. Cela est très utile dans les mises en page Flexbox pour gérer l’espacement interne entre les éléments.

 

 

Laisser un commentaire

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