צבע ורקעים

חלק מהיחידה עיצוב באמצעות CSS במסלול ה-HTML של Coddy. שיעור 32 מתוך 76.

אתגר

קל

במשימה הזו תתאימו אישית את צבעי הרקע של חלקים שונים בתפריט בית הקפה. השתמשו ביצירתיות שלכם כדי לבחור צבעים שיהפכו את התפריט למושך מבחינה חזותית!

בצעו את השלבים הבאים:

החילו צבע רקע על כל הדף (body). בחרו כל צבע שמתאים לאווירה של בית קפה.
החילו צבע רקע וצבע טקסט על הכותרת התחתונה (footer) שמשתלבים עם העיצוב הכללי של הדף.
אתם מוזמנים לשנות את הצבע של כל רכיב אחר כדי לשפר את הסגנון.

נסו בעצמכם

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