Recap Challenge #1

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

Challenge

Easy

In this first recap challenge, you'll apply your knowledge of text styling properties in CSS to recreate a specific design. This challenge will test your ability to combine various text properties, such as color, font-family, font-size, font-weight, text-align, and text-decoration.

You are given an HTML document with various elements. Your task is to apply different properties you have learned in this section to style these elements. Follow the steps below:

Write a CSS rule that targets all <h1> elements.
- Set the color to dark blue.
- Set the font size to 32px.
- Set the font weight to bold.
- Set the text alignment to center.
Write a CSS rule that targets the all elements with the class intro-text.
- Set the color to gray.
- Set the font-family to Arial, Helvetica, sans-serif;
- Set the font size to 18px.
Write a CSS rule that targets all <li> elements.
- Set the font-weight to 600.
Write a CSS rule that targets all <a> elements.
- Set the text-decoration to none.
- Set the font to your preferred font-family to "Times New Roman", Times, serif.

Try it yourself

<html>
<head>
    <title>Recap Challenge #1</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>Discovering the Ocean</h1>
    <p class="intro-text">The ocean covers 70% of the Earth's surface and is full of life. It also helps regulate the planet's climate.</p>
    <h2>Marine Life</h2>
    <ul>
        <li>Whales</li>
        <li>Octopuses</li>
        <li>Coral Reefs</li>
    </ul>
    <p>Learn more at <a href="https://www.oceans.org" target="_blank">The Ocean Conservation Society</a>.</p>
</body>
</html>