Font size
WorksheetsQuiz sur HTML, Git, Grid et Flexbox
Total questions: 50
Worksheet time: 41mins
Quelle balise HTML représente le contenu principal d’une page ?
<div>
<main>
<article>
<section>
Quelle balise est utilisée pour indiquer une navigation ?
<section>
<footer>
<nav>
<header>
Quelle unité est la plus adaptée pour un design responsive ?
px
%
em
rem
Quelle meta tag est indispensable pour un design mobile-first ?
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="refresh">
<meta name="description">
Quel attribut améliore l’accessibilité pour les lecteurs d’écran ?
(a)
À quoi sert @media (max-width: 768px) ?
À cibler les grands écrans
À cibler les écrans de plus de 768px
À cibler les écrans de moins de 768px
À désactiver le CSS
Corrige le code suivant pour qu’il soit sémantiquement correct :
<div>
<div>Mon Titre</div>
<div>Mon contenu</div>
</div>
Que permet le viewport meta tag ?
D’ajouter une animation
De définir l’échelle et la largeur de la page sur mobile
De changer la couleur du fond
D’ajouter un favicon
Quelle est la bonne syntaxe d’une media query ?
media (width: 600px)
@media only screen and (max-width: 600px)
@media width: 600px
if screen < 600px
Quelle propriété aide à conserver un contraste accessible ?
color-contrast
opacity
contrast-ratio
Aucune, c’est géré manuellement
Quelle commande crée une nouvelle branche ?
git create branch feature
git new feature
git branch feature
git checkout feature
Quelle commande permet de passer sur une autre branche ?
git branch
git checkout
Quelle commande fusionne une branche dans la branche courante ?
git merge nom_branche
git combine
git join
git rebase
À quoi sert git pull origin main ?
Télécharger les modifications et les fusionner localement
Télécharger les modifications
Fusionner localement
Envoyer les changements
Quelle est la différence entre git fetch et git pull ?
Aucune
fetch télécharge sans fusionner
pull télécharge sans fusionner
fetch supprime les branches locales
Que fait git stash ?
Sauvegarde temporairement les changements non commités
Supprime les fichiers
Fait un commit
Change de branche
Quelle commande liste toutes les branches ?
git list
git branch
git status
git show
Quelle est la bonne stratégie de branches ?
Tout sur main
Une branche par feature
Une branche par commit
Une branche par fichier
Quelle commande permet de supprimer une branche locale ?
git delete branch
git branch -d
git remove
git discard
Comment supprimer une branche locale ?
git delete branch
git branch -d nom_branche
git remove
git discard
Que fait `git revert` ?
Supprime un commit
Annule un commit en créant un nouveau commit
Efface le repo
Repart de zéro
Quelle propriété transforme un conteneur en grid ?
display: flex;
display: grid;
grid: on;
layout: grid;
Quelle propriété définit le nombre de colonnes ?
grid-columns
grid-template-columns
column-template
grid-repeat
Quelle unité permet de diviser l’espace disponible (css)?
(a)
Quelle syntaxe est correcte ?
grid-template-columns: repeat(3, 1fr);
grid-columns: 3fr;
columns: repeat(3, fr);
grid-template: 1fr 1fr 1fr;
Que fait `grid-gap` ?
Ajoute de la marge autour du grid
Ajoute de l’espace entre les cellules
Change la largeur
Définit le padding
Quelle propriété définit les lignes ?
grid-template-rows
grid-lines
grid-template-line
rows-template
Quelle propriété positionne un élément dans la grille ?
grid-column et grid-row
flex-position
place-element
align-item
Que fait `grid-area` ?
Donne un nom à une zone
Définit une couleur
Ajoute un espace
Crée une bordure
Quelle propriété combine `align-items` et `justify-items` ?
center-items
place-items
align-center
justify-center
Quelle valeur permet d’adapter automatiquement la taille des colonnes ?
auto-fit
fit-content
repeat-auto
auto-size
Quelle propriété transforme un conteneur en flexbox ?
display: flex;
flex: on;
display: block;
layout: flex;
Quelle direction est utilisée par défaut ?
row
column
row-reverse
column-reverse
Quelle propriété aligne horizontalement les éléments ?
justify-content
align-items
align-content
flex-flow
Quelle propriété aligne verticalement les éléments ?
justify-content
align-items
align-content
flex-wrap
Que fait `flex-wrap: wrap;` ?
Empêche le retour à la ligne
Force le retour à la ligne
Centre le contenu
Inverse la direction
Quelle valeur de `justify-content` centre horizontalement ?
space-around
space-between
center
start
Quelle propriété contrôle la largeur relative d’un élément ?
flex-grow
flex-width
flex-stretch
grow
Que fait `align-self` ?
Change l’alignement d’un seul élément
Aligne tout le conteneur
Ajoute un padding
Étire tous les éléments
Quelle propriété combine direction et wrap ?
flex-flow
flex-all
flex-control
flex-set
Écris le code CSS pour centrer verticalement et horizontalement les éléments à l’intérieur d’un conteneur.
Crée une grille à 3 colonnes et 2 lignes avec des cellules égales.
Quelle suite de commandes permet de créer une branche feature/navbar et de la publier sur le dépôt distant ?
Applique une couleur rouge au texte uniquement sur les écrans de moins de 600px de large.
Quelle est la principale différence entre CSS Grid et Flexbox ?
CSS Grid est plus adapté pour la mise en page générale d’un site, tandis que Flexbox est meilleur pour l’alignement interne.
Quelle propriété permet de définir l’espacement entre les éléments d’un flexbox ?
Comment centrer un élément en flexbox (horizontalement et verticalement) ?
justify-content:center
align-items:center
Les deux précédentes
Aucune
Quelle est la différence entre git pull et git fetch ?
git pull télécharge et applique les changements, git fetch ne fait que télécharger
git fetch applique automatiquement les changements
git pull et git fetch sont identiques
git pull ne fonctionne que pour la branche main
À quoi sert .gitignore ?
À cacher des fichiers sur GitHub
À ignorer certains fichiers pour qu'ils ne soient pas suivis par Git
À supprimer des fichiers définitivement
À enregistrer tous les fichiers modifiés
