Selection Challenge

Part of the Styling with CSS section of Coddy's HTML journey — lesson 16 of 76.

Challenge

Easy

You are given an HTML document with various elements, including headings (<h1>, <h2>), paragraphs (<p>), a division (<div>), and an unordered list (<ul>) with list items (<li>). Your task is to use different types of selectors to style these elements. Follow the steps below:

Write a CSS rule using a type selector that targets all <p> elements. Set the text color to blue and the font size to 16 pixels.
Add a class attribute with the value "highlight" to the <h2> element and the <div> element.
Write a CSS rule using a class selector that targets all elements with the class "highlight". Set the background color to yellow.
Add an id attribute with the value "special" to the <ul> element.
Write a CSS rule using an ID selector that targets the element with the ID "special". Set the background color to lightgray and the font size to 20 pixels.
Write a CSS rule using a group selector that targets all <h1> and <li> elements. Set the text color to red.

Try it yourself

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