Wyzwanie: selektory

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

Wyzwanie

Łatwy

Otrzymujesz dokument HTML zawierający różne elementy, w tym nagłówki (<h1>, <h2>), akapity (<p>), element <div> oraz nieuporządkowaną listę (<ul>) z elementami listy (<li>). Twoim zadaniem jest użycie różnych typów selektorów do stylizacji tych elementów. Wykonaj poniższe kroki:

Napisz regułę CSS z użyciem selektora typu, która wybiera wszystkie elementy <p>. Ustaw kolor tekstu na niebieski, a rozmiar czcionki na 16 pikseli.
Dodaj atrybut class o wartości "highlight" do elementu <h2> i elementu <div>.
Napisz regułę CSS z użyciem selektora klasy, która wybiera wszystkie elementy z klasą "highlight". Ustaw kolor tła na żółty.
Dodaj atrybut id o wartości "special" do elementu <ul>.
Napisz regułę CSS z użyciem selektora ID, która wybiera element o ID "special". Ustaw kolor tła na jasnoszary, a rozmiar czcionki na 20 pikseli.
Napisz regułę CSS z użyciem selektora grupowego, która wybiera wszystkie elementy <h1> i <li>. Ustaw kolor tekstu na czerwony.

Spróbuj swoich sił

<html>
<head>
    <title>Selection Challenge</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a main heading</h1>
    <h2>This is a subheading</h2>
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <div>This is a division.</div>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</body>
</html>