An open API service indexing awesome lists of open source software.

https://github.com/lorussogiacomoluca/html-css-booleaner

Exercise #3 - 17/02/2025
https://github.com/lorussogiacomoluca/html-css-booleaner

border cards css html5 margin padding table ul

Last synced: 10 months ago
JSON representation

Exercise #3 - 17/02/2025

Awesome Lists containing this project

README

          

# Esercizio 3

## 🖥️ Esercizio: Booleaner Layout

📝 **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](https://stylestage.dev/)
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! 💪