NEW
Font size
WorksheetsQuiz sur le CSS et WordPress
Total questions: 20
Worksheet time: 10mins
Que signifie CSS ?
Creative Style System
Cascading Style Sheets
Central Style Settings
Coding Style Source
Quel est le rôle du CSS ?
Créer une base de données
Gérer le contenu textuel d’un site
Définir le style et l’apparence des éléments HTML
Générer des images
Quel symbole utilise-t-on pour cibler une **classe** en CSS ?
#
.
:
Aucun symbole
Et pour un **ID**, on utilise :
.
#
*
id:
Lequel de ces exemples cible un élément avec la classe `btn` ?
#btn {}
.btn {}
btn {}
:btn {}
À quoi servent les **accolades `{}`** en CSS ?
À inclure du texte
À faire des commentaires
À regrouper les propriétés appliquées à un sélecteur
À encadrer du code JavaScript
Que fait cette règle CSS : `p { text-align: center; }`
Elle transforme tous les paragraphes en majuscule
Elle centre le texte dans tous les paragraphes
Elle change la couleur du texte
Elle aligne le paragraphe à droite
Quelle propriété CSS change la **couleur du texte** ?
background-color
color
font-style
text-color
Et la couleur de **fond** ?
color
background-color
bg
font-color
Quelle propriété rend un élément plus gros au survol ?
font-weight
hover
transform: scale(...)
z-index
Quelle est l'utilité de `transition: transform 0.3s ease;` ?
Appliquer une animation GIF
Ajouter une bordure animée
Rendre la transformation fluide (zoom, déplacement, etc.)
Cacher l’élément
Que fait `:hover` ?
Cible un bouton cliqué
Applique un style quand la souris survole l’élément
Applique un style mobile
Applique un effet d’apparition
Comment inspecter un élément dans un navigateur ?
Double-cliquer sur le logo
Aller dans les réglages du site
Clic droit → Inspecter
Rafraîchir la page
Où vois-tu le HTML dans l’inspecteur ?
À gauche
À droite
Tout en haut
Il n’est pas visible
Et le CSS de l’élément sélectionné ?
Dans la console
À droite
Dans le HTML
Dans les paramètres du navigateur
Que signifie cette ligne ? `elementor-button { background-color: red; }`
Tous les boutons sont supprimés
Tous les boutons avec la classe `elementor-button` ont un fond rouge
Tous les boutons deviennent des liens
Le texte devient rouge
Quelle commande CSS ajoute une **ombre** à un élément ?
text-shadow
opacity
box-shadow
shadow
À quoi sert `z-index` ?
Ajuster la couleur du texte
Réduire la taille d’un bloc
Gérer la superposition des éléments (qui passe devant)
Changer la police
Que fait `object-fit: cover;` ?
Étirer une image de manière déformée
Remplir une zone tout en gardant le bon ratio
Changer la couleur du fond d'une image
Ajouter une bordure
Que fait `position: sticky;` ?
Fait flotter l’élément sur les autres
Fixe un élément en haut de la page lorsqu'on scrolle
Cache l’élément automatiquement
Le rend invisible au clic
