The color property changes text color. You can use named colors, hex codes, or rgb values.
CSS
Learn styling and layout for web pages.
1
Text Color
Example
Run this example to see how it works and then try the exercise.
Loading...
Output
Click "Run" to see the example in action...Exercise
Your task: Add a color property to make the h1 blue
Loading...
Output
Click "Run" to execute your code...Quiz
Which property changes text color?
SUMMARY
In this section, you learned how to change text color. Next, you'll learn how to set background colors.
2
Background Color
background-color sets the element’s background color.
Example
Run this example to see how it works and then try the exercise.
Loading...
Output
Click "Run" to see the example in action...Exercise
Your task: Add a lightblue background-color
Loading...
Output
Click "Run" to execute your code...Quiz
How do you set a red background?
SUMMARY
In this section, you learned how to set background colors. Next, you'll learn how to style fonts.
3
Font Properties
Control typography with font-size, font-weight, and font-family.
Example
Run this example to see how it works and then try the exercise.
Loading...
Output
Click "Run" to see the example in action...Exercise
Your task: Set font-size to 20px
Loading...
Output
Click "Run" to execute your code...Quiz
Which unit is commonly used for font size?
SUMMARY
In this section, you learned how to style fonts. Next, you'll learn how to use selectors to target elements.
Unlock 10 More Lessons
You've completed the free preview! Upgrade to Pro to access all 12 lessons in this course, plus advanced projects and certificates.
Locked lessons:
- Selectors
- Box Model - Padding
- Box Model - Margin
- Borders
- Border Radius
- Width and Height
- Display Property
- Flexbox Basics
- Flexbox Alignment