Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Challenge: Variables in CSS | Introduction to CSS
CSS Fundamentals
course content

Course Content

CSS Fundamentals

CSS Fundamentals

1. Introduction to CSS
2. Text Styles
3. Box Model and Element Spacing
4. Flexbox
5. Decorative Effects

bookChallenge: Variables in CSS

Task

We are tasked with styling a blog web page. The objective is as follows:

  1. Define the color in the :root block:
    • Create a variable named --description-color and assign it the value #9e6f21.
  2. Apply the --description-color variable as a value of the color property to <p> elements with the class .description.
html

index

css

index

js

index

copy
  • Utilize -- followed by a descriptive name to create a variable, then set the : and assign it a value.
  • Assign the value #9e6f21 to the variable.
  • Employ var(), and within the brackets, specify the variable name to use the variable as a property value.
html

index

css

index

js

index

copy

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 1. Chapter 10
some-alt