Le parcours ❤️ HTML/CSS

Notions

display styles de texte

Instructions

• Le html est déjà construit
• Seul le fichier CSS exo1.css est a éditer
• Il faut respecter aussi le gras, l'italique, la largeur des paragraphes

Notions

arrondis responsive pseudo-classes BEM transform

Instructions

• Le html est déjà construit
• Le style doit aller dans le fichier css/exo2.css
• Au moment où la souris survole les ronds, ils doivent changer de couleur !
• En bonus, au survol, les ronds doivent grossir aussi !

Ressources

• transform

Notions

position box-model

Instructions

• Le html est à construire dans html/exo3.html
• Le style doit aller dans le fichier css/exo3.css
• Un carré noir de 100px au milieu de la page, peu importe la taille ou le scroll de la fenêtre
• Un rond rouge en haut à droite de 20px de diamètre
• Le carré doit toujours resté au centre du navigateur !

Notions

flexbox box-model

Instructions

• Reproduire le drapeau du Panama
• Utiliser flexbox
• Le html est déjà constuit html/exo4.html et ne doit pas être modifié
• Le style doit aller dans le fichier css/exo4.css