Section 1 - Instruction

You've learned CSS selectors and text styling properties. Now let's combine them to create well-designed, readable web content that grabs attention and guides users through your page.

The key is knowing which elements to target and how to style them effectively.

Engagement Message

Ready to create some eye-catching text designs?

Section 2 - Practice

Type

Swipe Left or Right

Practice Question

Let's match CSS selectors with the best text styling approach for each scenario:

Labels

  • Left Label: Type Selectors Work Best
  • Right Label: Class/ID Selectors Work Best

Left Label Items

  • Making all paragraphs consistent
  • Setting default body font
  • Styling all headings similarly
  • Creating base text color

Right Label Items

  • Highlighting important quotes
  • Styling a unique page title
  • Creating warning messages
  • Making special call-out boxes
Section 3 - Practice

Type

Multiple Choice

Practice Question

You're styling a blog post. Which CSS rule would make the most visual impact for readability?

A. p { color: gray; font-size: 14px; } B. h1 { color: #333; font-size: 32px; font-weight: bold; } C. body { font-family: Arial; } D. .small-text { font-size: 10px; }

Suggested Answers

  • A
  • B - Correct
  • C
  • D
Section 4 - Practice

Type

Fill In The Blanks

Markdown With Blanks

Fill in the CSS to create a standout quote section:

Sign up
Join the 1M+ learners on CodeSignal
Be a part of our community of 1M+ users who develop and demonstrate their skills on CodeSignal