Menu
Coddy logo textTech

Wyzwanie powtórkowe #2

Część sekcji Stylizacja za pomocą CSS ścieżki HTML w Coddy. Lekcja 24 z 76.

challenge icon

Wyzwanie

Łatwy

W tym drugim wyzwaniu powtórkowym wykorzystasz swoją wiedzę na temat właściwości stylizowania tekstu w CSS, aby odtworzyć konkretny projekt. To wyzwanie sprawdzi Twoją umiejętność łączenia różnych właściwości tekstu, takich jak color, font-family, font-size, font-weight, text-align i text-decoration, aby dopasować elementy do podanego projektu. 

Otrzymujesz dokument HTML z nagłówkiem (<h1>), akapitem (<p>), linkiem (<a>) i listą nieuporządkowaną (<ul>) zawierającą elementy listy (<li>). Twoim zadaniem jest użycie poznanych właściwości stylizowania tekstu, aby nadać tym elementom styl zgodny z projektem przedstawionym na poniższym obrazie:

Wykonaj poniższe kroki:

  1. Napisz regułę CSS, która wybiera element <h1>. Ustaw color na black, font-family na "Times New Roman", Times, serif, font-size na 48px, font-weight na bold, a text-align na center.
  2. Napisz regułę CSS, która wybiera element <p>. Ustaw color na gray, font-family na Arial, Helvetica, sans-serif, font-size na 18px, a text-align na center.
  3. Napisz regułę CSS, która wybiera element <a>. Ustaw color na red, a text-decoration na none.
  4. Napisz regułę CSS, która wybiera wszystkie elementy <li>. Ustaw color na green, font-family na "Courier New", Courier, monospace, font-size na 25px, a font-weight na 600.

Spróbuj swoich sił

<html>
<head>
    <title>Recap Challenge #2</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph with a <a href="#">link</a>.</p>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</body>
</html>

Wszystkie lekcje w sekcji Stylizacja za pomocą CSS

Poćwicz samodzielnie: Edytor online Web