Colori e sfondi

Fa parte della sezione Stilizzare con CSS del percorso HTML di Coddy. Lezione 32 di 76.

Sfida

Facile

In questa attività, personalizzerai i colori di sfondo delle diverse sezioni del menu del café. Usa la tua creatività per scegliere colori che rendano il menu visivamente accattivante!

Segui i passaggi qui sotto:

Applica un colore di sfondo all'intera pagina (body). Scegli un colore adatto al tema di un café.
Applica un colore di sfondo e un colore del testo al piè di pagina (footer) che si abbinino al design complessivo della pagina.
Sentiti libero di cambiare il colore di qualsiasi altro elemento per migliorare gli stili.

Provalo tu

<html>
<head>
    <title>Café Menu</title>  
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <h1>Café Delight</h1>
        <p class="welcome">Welcome to our café! Enjoy a delicious meal.</p>
    </header>
    <div class="menu-category">
        <h2>Appetizers</h2>
        <ul>
            <li>
                <p class="dish-name">Bruschetta $5.99</p>
            </li>
            <li>
                <p class="dish-name">Garlic Bread $3.50</p>
            </li>
        </ul>
    </div>
    <div class="menu-category">
        <h2>Main Courses</h2>
        <ul>
            <li>
                <p class="dish-name">Spaghetti Carbonara $12.99</p>
            </li>
            <li>
                <p class="dish-name">Grilled Chicken Salad $9.99</p>
            </li>
        </ul>
    </div>
    <div class="menu-category">
        <h2>Desserts</h2>
        <ul>
            <li>
                <p class="dish-name">Chocolate Cake $4.99</p>
            </li>
            <li>
                <p class="dish-name">Cheesecake $5.49</p>
            </li>
        </ul>
    </div>
    <footer>
        <p>&copy; 2025 Café Delight - All rights reserved</p>
    </footer>
</body>
</html>