Write CSS to style a heading (centre, uppercase, letter spacing)

Description: Style an h1 heading so that it is centred, in capital letters, with extra space between the letters and a line below it.

Hint:

• Use text-align, text-transform, letter-spacing and border-bottom.

---

CSS to style a heading

<style>
  h1 {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 4px;
    border-bottom: 3px solid #0073aa;
    padding-bottom: 8px;
  }
</style>

<h1>Welcome to my site</h1>

Output in the browser:

How it works

• text-transform: uppercase shows the text in capitals, though it is written in small letters in HTML.
• letter-spacing adds space between the letters.

Read CSS Text.

• Previous Exercise
• Next Exercise

---

Tutorials
No Content Found.

Exercises & Assignments
No Content Found.

Interview Questions & Answers
No Content Found.