Style du texte

Fait partie de la section Styling with CSS du Journey HTML de Coddy — leçon 31 sur 76.

Défi

Facile

Dans cette tâche, vous allez personnaliser la taille de la police, la couleur et la décoration de différents éléments de la page.

Suivez les étapes ci-dessous :

Définissez la taille de la police de l'élément <h1> sur 36px, et appliquez une décoration underline.
Définissez la graisse de la police (font weight) de l'élément avec la classe welcome sur 700.
Définissez la taille de la police des éléments <h2> (titres de catégorie) sur 24px, et la couleur de la police sur n'importe quelle couleur de votre choix (autre que le noir).
Définissez la couleur de la police des éléments avec la classe dish-name sur n'importe quelle couleur de police de votre choix (autre que le noir).

Essayez vous-même

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