QCM HTML / CSS – Partie 27

Questions pratiques pour testez vos connaissances sur le langage HTML à savoir l’utilisation du code HTML, structurer une page web en HTML, organiser les éléments d’une page Web, etc. Testez votre connaissance et travaillez sur les questions que vous trompez le plus souvent.
 
 

1. Comment créer un conteneur avec un fond semi-transparent tout en gardant son contenu lisible ?

A background-color: rgba(255, 0, 0, 0.5);

B background-opacity: 0.5;

C background-color: transparent;

D background-image: transparent;

2. Quelle propriété CSS permet de créer un effet de zoom sur une image lorsqu’un utilisateur passe la souris dessus ?

A transform: scale(1.2);

B zoom: 1.2;

C transform: zoom(1.2);

D scale: 1.2;

3. Comment donner à une page web un arrière-plan dynamique qui évolue lentement sur toute la page ?

A background-image: linear-gradient;

B background-attachment: fixed;

C background-position: fixed;

D background-size: cover;

body {
  background-image: url('background.jpg');
  background-attachment: fixed;
}

4. Quel est le rôle du modèle CSS Flexbox ?

A Créer une grille de mise en page

B Créer une disposition flexible et dynamique

C Modifier la taille des éléments

D Organiser les éléments dans un tableau

5. Si vous souhaitez créer une animation de texte qui fait apparaître les lettres une par une, quel type d’animation pouvez-vous utiliser ?

A @keyframes

B text-appear

C @animate-text

D @sequence

6. Quelle propriété CSS permet de rendre une image plus nette sur des écrans haute résolution comme les écrans Retina ?

A image-smoothing

B image-resolution

C image-rendering

D background-image-resolution

7. Vous voulez afficher un tableau HTML avec des bordures entre les cellules, mais sans bordure autour du tableau lui-même. Quelle propriété CSS devriez-vous utiliser ?

A border-collapse: separate;

B border-collapse: collapse;

C border-style: none;

D border: 1px solid transparent;

8. Quelle propriété CSS permet de transformer un élément HTML en un conteneur flexible avec des éléments répartis sur plusieurs lignes si nécessaire ?

A flex-wrap: wrap;

B flex-direction: column;

C justify-content: space-evenly;

D align-items: center;

9. Vous voulez que votre page ait un en-tête fixe (sticky) qui reste visible même lorsqu’on fait défiler la page. Quelle propriété CSS utilisez-vous ?

A position: fixed;

B position: sticky; top: 0;

C position: absolute;

D position: relative;

header {
  position: sticky;
  top: 0;
  z-index: 1000;
}

10. Vous voulez appliquer un effet de flou à une image lorsqu’on passe la souris dessus, mais sans changer la taille de l’image. Quelle propriété CSS utilisez-vous ?

A filter: blur(5px);

B filter: opacity(0.5);

C transform: scale(1.1);

D background-blur: 5px;

img:hover {
  filter: blur(5px);
  transition: filter 0.3s ease;
}