QCM HTML / CSS – Partie 30

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. Quelle propriété CSS permet de changer la couleur d’un élément en douceur lorsqu’un utilisateur survole cet élément ?

A transition: color 0.5s;

B hover: color 0.5s;

C color: transition 0.5s;

D color: smooth;

A
La propriété transition permet de définir une animation douce sur les changements de propriété. Ici, color 0.5s indique que la couleur de l’élément changera en 0.5 seconde lors de l’interaction.

 

 

2. Quelle propriété CSS permet de faire pivoter un élément autour de son axe avec une valeur de 45 degrés ?

A transform: 45deg

B transform-rotate(45deg)

C rotate(45)

D rotate(45deg)

D
La propriété transform avec la fonction rotate() permet de faire pivoter un élément autour de son point d’origine. La valeur 45deg signifie une rotation de 45 degrés.

 

 

3. Quelle balise HTML permet de créer un champ de saisie pour un numéro de téléphone ?

A <input type="number">

B <input type="tel">

C <input type="phone">

D <input type="text">

B
L’attribut type="tel" est utilisé pour définir un champ permettant la saisie d’un numéro de téléphone. Bien que ce champ ne valide pas automatiquement la structure du numéro, il peut déclencher un clavier spécifique sur les appareils mobiles.

 

 

4. Que fait la propriété CSS position: absolute; ?

A Elle fixe un élément par rapport à son parent le plus proche avec une position définie.

B Elle positionne un élément par rapport à la fenêtre du navigateur.

C Elle fait défiler un élément de manière absolue dans la page.

D Elle empêche un élément de se déplacer à l’intérieur de son conteneur.

A
Lorsqu’un élément est positionné avec position: absolute;, il est positionné par rapport à son parent le plus proche ayant une position définie (autre que static), ou par rapport à la fenêtre si aucun parent n’est défini.

 

 
 

5. Quelle propriété CSS permet d’appliquer une transition fluide sur plusieurs propriétés d’un élément ?

A transition-properties: all;

B transition-duration: 1s;

C transition-timing: ease-in;

D transition: all 1s ease;

D
La syntaxe transition: all 1s ease; applique une transition fluide de 1 seconde sur toutes les propriétés CSS de l’élément, et ease définit la fonction de temporisation pour l’animation.

 

 

6. Quel attribut HTML est utilisé pour grouper plusieurs options dans un formulaire pour les organiser ?

A fieldset

B group

C optgroup

D selectgroup

C
L’attribut optgroup est utilisé dans un <select> pour regrouper des options sous un même libellé, améliorant ainsi l’organisation de la liste déroulante. Voir un exemple complet.

 

 

7. Quel sélecteur CSS permet de cibler tous les éléments <p> à l’intérieur d’un élément ayant la classe .content ?

A .content > p

B .content p

C p.content

D #content p

B
Le sélecteur .content p cible tous les éléments <p> à l’intérieur d’un élément avec la classe .content. Si vous utilisez .content > p, il ne ciblerait que les <p> qui sont des enfants directs de .content.

 

 

8. Quelle entité HTML permet d’afficher le symbole « © » ?

A &copy;

B &symbol;

C &copy-symbol;

D &right-symbol;

A
L’entité HTML &copy; permet d’afficher le symbole du copyright « © ». Cela permet de rendre ce symbole compatible avec tous les navigateurs et systèmes d’encodage.

 

 
 

9. Quelle propriété CSS permet d’ajouter une ombre portée à un texte ?

A text-shadow

B box-shadow

C shadow-text

D shadow-box

A
La propriété text-shadow permet d’ajouter une ombre au texte, en définissant sa position, son flou et sa couleur.

 

 

10. Quel attribut HTML est utilisé pour spécifier la largeur et la hauteur d’une image avant qu’elle ne soit complètement chargée ?

A srcset

B width et height

C img-size

D loading="lazy"

B
Les attributs width et height sont utilisés pour définir les dimensions d’une image HTML, permettant aux navigateurs de réserver l’espace nécessaire avant que l’image ne soit complètement chargée.

 

 

Laisser un commentaire

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