CSS Text



CSS Tutorial  >  Text

CSS provides a number of properties to manage the display of text. The most common ones are listed below:

  • direction: sets the direction of text flow.
  • letter-spacing: sets the amount of space between letters.
  • line-height: sets the amount of space between the baseline of two lines.
  • text-align: sets the justification properties of text.
  • text-decoration: determines how to use a line to decorate text.
  • text-indent: sets the amount of space to indent before each line of text in a block.
  • text-transform: sets whether upper-case letters or lower-case letters are used.
  • word-spacing: sets the amount of space between two words.

    Below are a few examples to show the impact:

    Example 1: change amount of space between letters and add an underline

    CSS Declaration

    p {
      letter-spacing: 5px;
      text-decoration: underline;
    }

    The following HTML,

    <p>Wider gaps between letters with underline.</p>

    renders

    Wider gaps between letters with underline.

    Example 2: align text to the right, use all upper case letters, and use double space between lines

    CSS Declaration

    p {
      text-align: right;
      text-transform: uppercase;
      line-height: 2;
    }

    The following HTML,

    <p>This paragraph is justified to the right, double-spaced, and in all caps. </p>

    renders

    This paragraph is justified to the right, double-spaced, and in all caps.

    Next: CSS Direction




    Copyright © 2016   1keydata.com   All Rights Reserved   Privacy Policy   About   Contact