Use a CSS Class to Style an Element

Classes are reusable styles that can be added to HTML elements.

Here's an example CSS class declaration:

<style>
  .blue-text {
    color: blue;
  }
</style>

You can see that we've created a CSS class called blue-text within the <style> tag. You can apply a class to an HTML element like this: <h2 class="blue-text">CatPhotoApp</h2>. Note that in your CSS style element, class names start with a period. In your HTML elements' class attribute, the class name does not include the period.


Inside your style element, change the h2 selector to .red-text and update the color's value from blue to red.

Give your h2 element the class attribute with a value of red-text.

Tests

  • Waiting: 1. Your h2 element should be red.
  • Waiting: 2. Your h2 element should have the class red-text.
  • Waiting: 3. Your stylesheet should declare a red-text class and have its color set to red.
  • Waiting: 4. You should not use inline style declarations like style="color: red" in your h2 element.
/**
* Your test output will go here
*/