CSS Text Color and Decoration
Learn how to use CSS properties to control the color, style, and visual appearance of your text.
Dressing Words: CSS Text Styling
With CSS, you can bring your text to life. Properties like `color`, `text-decoration`, and `text-shadow` allow you to change the appearance of your words in a creative way.
The 'color' Property
The color property sets the color of the text. It's applied directly to the element you want to style. For example: p { color: blue; }.
The 'text-decoration' Property
The text-decoration property is used to add or remove lines from text. Common values include underline, overline, and line-through. Using none is common to remove the default underline from links.
The 'text-shadow' Property
The text-shadow property adds a shadow effect. It takes values for horizontal offset, vertical offset, blur radius, and color. For example: h1 { text-shadow: 2px 2px 4px gray; }.
Practice Zone
Interactive Test 1: Drag & Drop
Arrastra en el orden correspondiente.
Arrastra las opciones:
Completa el código:
Interactive Test 2: Fill in the Blanks
Rellena los huecos en cada casilla.
p { color: ; text-decoration: ; text-shadow: ;}
Practice Example: Code Editor
Write a CSS rule that styles a paragraph with `red` text color, an `underline`, and a `gray` text shadow.