Menu
CoddyTech

Warna dan Latar Belakang

Termasuk bagian Menata dengan CSS dalam perjalanan HTML di Coddy. Pelajaran 32 dari 76.

challenge icon

Tantangan

Mudah

Dalam tantangan ini, kamu akan menyesuaikan warna latar belakang berbagai bagian menu kafe. Gunakan kreativitasmu untuk memilih warna yang membuat menu tampak menarik!

Ikuti langkah-langkah berikut:

  1. Terapkan warna latar belakang pada seluruh halaman (body). Pilih warna apa pun yang sesuai dengan tema kafe.
  2. Terapkan warna latar belakang dan warna teks pada footer (footer) yang melengkapi desain halaman secara keseluruhan.
  3. Kamu bebas mengubah warna elemen lain untuk memperindah gaya.

Coba sendiri

<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>

Semua pelajaran di Menata dengan CSS

Latihan sendiri: Playground Web