Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Leer Challenge: Text Formatting | Text Styles
CSS Fundamentals

book
Challenge: Text Formatting

Task

To enhance the visual presentation of the h1 element, apply the following styles:

  • Add an underline.

  • Convert all letters to uppercase.

  • Horizontally recenter the text.

  • Set the line height to 2.

  • Adjust the letter spacing to 2px.

  • Increase the space between words to 5px.

  • Apply a text shadow with the values 2px 2px #000000.

html

index.html

css

index.css

copy
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="index.css" />
</head>
<body>
<h1>Welcome to my Website</h1>
</body>
</html>
  • text-decoration: Underlines the text.

  • text-transform: Converts the text to uppercase.

  • text-align: Centers the text horizontally.

  • line-height: Sets the height of the text.

  • letter-spacing: Increases the space between letters.

  • word-spacing: Increases the space between words.

  • text-shadow: Adds a shadow.

html

index.html

css

index.css

copy
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="index.css" />
</head>
<body>
<h1>Welcome to my Website</h1>
</body>
</html>

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 2. Hoofdstuk 3

Vraag AI

expand

Vraag AI

ChatGPT

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

some-alt