Text Alignment (text-align), Text Decoration (text-decoration)

Let's learn about the CSS properties text-align and text-decoration, which specify the alignment direction and decoration of text.

text-align is a property that specifies the horizontal alignment of content (mainly text) within an HTML element.

• Left Alignment:

  CSS

  Copy
  .left-align {
    text-align: left;
  }

• Center Alignment:

  CSS

  Copy
  .center-align {
    text-align: center;
  }

• Right Alignment:

  CSS

  Copy
  .right-align {
    text-align: right;
  }

• Justify Alignment:

  CSS

  Copy
  .justify-align {
    text-align: justify;
  }

text-decoration is a property that adds or removes decorations from text.

• Underline:

  CSS

  Copy
  .underline {
    text-decoration: underline;
  }

• Overline:

  CSS

  Copy
  .overline {
    text-decoration: overline;
  }

• Line-through (Strikethrough):

  CSS

  Copy
  .line-through {
    text-decoration: line-through;
  }

• No Decoration:

  CSS

  Copy
  .no-decoration {
    text-decoration: none;
  }

Follow the emphasized parts of the code to practice.