Menu
Coddy logo textTech

Renk ve Arka Planlar

Coddy'nin HTML Journey'sinin Styling with CSS bölümünün bir parçası — ders 32 / 76.

challenge icon

Görev

Kolay

Bu görevde, kafe menüsünün farklı bölümlerinin arka plan renklerini özelleştireceksiniz. Menüyü görsel olarak çekici kılacak renkler seçmek için yaratıcılığınızı kullanın!

Aşağıdaki adımları izleyin:

  1. Tüm sayfaya (body) bir arka plan rengi uygulayın. Kafe temasına uygun herhangi bir renk seçin.
  2. Alt bilgiye (footer), sayfanın genel tasarımını tamamlayan bir arka plan rengi ve metin rengi uygulayın.
  3. Stilleri geliştirmek için diğer öğelerin renklerini değiştirmekten çekinmeyin.

Kendin dene

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

Styling with CSS bölümündeki tüm dersler