Riproducete il 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.
Nel caso non vi venga in mente come spaziare il contenuto interno all'header non preoccupatevi, passate oltre! Potreste aver bisogno di una regola css che avete usato durante il fundamental... 😃
Partendo dallo stesso HTML, create un secondo file CSS per crearne una versione diversa. Si può fare? Alla grande! https://stylestage.dev/ Questa versione avrà il corpo pagina più stretto e centrato. Occhio all'header il cui background rimane invece a tutta pagina.
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 repo github per l'esercizio di oggi, con il nome indicato come nome repo e clonatela tramite vscode scegliendo una cartella sul vostro pc;
- All'interno della cartella del repo, 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 repo create la cartella css nella quale inserirete creandolo/i il/i vostri file css.
Ricordatevi di pushare di tanto in tanto per consegnare il vostro lavoro in modo incrementale. Buon lavoro!