Exercice 01 - Révision HTML/CSS
Table des matières
Mise en situation
La revanche est un RESTO-PUB LUDIQUE n. m. - Endroit chaleureux où l'on peut jouer, boire et manger dans une ambiance de plaisir !
Voici la nouvelle mise en page
Modalités
- Exercice seul
- Réaliser durant le cours
- Durée approximative le reste du cours
- Remettre le tout sur Léa dans Exercice 01 pour le prochain cours!
À faire (étapes)
- Téléchargez et utilisez le HTML5boilerplate
- Réalisez tout d'abord le positionnement HTML de l'image fournie (le logo) dans index.html (balises essentielles ex header, footer, main, aside)
- Faites ensuite la mise en page CSS, je vous recommande le positionnement CSS Grid
- Pour finir pour donner une idée au client vous allez insérer en HTML et styliser en css les différents éléments suivants:
Entête
- Titre de site h1
- Logo fourni plus haut img
- Menu principal du site avec 2 pages nav ul li
Zone principale
- Un titre de page h2
- Un petit paragraphe Lorem psum ou autre texte généré
- Une liste à puce
Zone sur le côté (aside)
- Une image placehold
- Un petit texte de promotion Lorem psum ou autre texte généré
- Un exemple d'hyperlien
Pied de page
- Un texte de copyright
- Un lien de courriel (mailto:) et un lien téléphone (tel:)
- Un lien revenir en haut (fonctionnel)