📝 Esercizio: Riproducete il layout in allegato utilizzando l'approccio visto in classe. Fate un piccolo blocco alla volta aggiungendo ad ogni step le regole CSS. Come sempre aiutatevi con le slide e tutto ciò che avete a disposizione.
🎯 Bonus Partendo dallo stesso HTML, create un secondo file CSS per crearne una versione diversa. Si può fare? Alla grande! 🔥 Style Stage Questa versione avrà il corpo pagina più stretto e centrato. Occhio all'header il cui background rimane invece a tutta pagina.
📤 Consegna Riproducete il layout dell'immagine allegata utilizzando ciò che abbiamo visto stamattina aiutandovi con le slide, video e documentazione. Come l'esercizio scorso e d'ora in avanti sempre, faremo questo:
- 📂 Create una nuova cartella con nome html-css-booleaner
- 📝 Apritela con VSCode e create il file index.html (sarà la prima pagina ad aprirsi in un sito). Attenzione: per i nomi dei file usate sempre lettere minuscole e trattini al posto degli spazi 😉
- 🖼️ All'interno della cartella del repo, create una sottocartella img nella quale inserirete le immagini necessarie.
- 🎨 Sempre nella cartella, create la cartella css nella quale inserirete creandolo il vostro file CSS.
- 🔄 Ora, andiamo sul tab GIT e clicchiamo “Publish on GitHub”, ricordando poi di selezionare una repo pubblica.
- ✅ Poi clicchiamo ok e verifichiamo che la repo sia stata creata effettivamente su GitHub prima di procedere con l’esercizio.
📂 Il bonus deve essere consegnato all'interno di una cartella chiamata bonus da realizzare dentro la repo stessa.
📌 Numero minimo di push: 8
🚀 Ricordatevi di pushare di tanto in tanto per consegnare il vostro lavoro in modo incrementale.
Buon lavoro! 💪