Formatting and Styling Text in CSS

Text indention [text-indent]
The property text-indent allows you to add an elegant touch to text paragraphs by applying an indent to the first line of the paragraph.

 
  p {
      text-indent: 10px;
    }

Text alignment [text-align]
The CSS property text-align corresponds to the attribute align used in old versions of HTML. Text can either be aligned to the left, to the right or centred. In addition to this, the value justify will stretch each line so that both the right and left margins are straight.

 
     p {
	  text-align: left;
       }
     h1{
	  text-align: right;
       }
     h2{
	  text-align: center;
       }
     b {
	  text-align: justify;
	}

Text decoration [text-decoration]
The property text-decoration makes it is possible to add different "decorations" or "effects" to text. Some properties are underline, overline, line-through.

 
        h1 {
		text-decoration: underline;
	}

	h2 {
		text-decoration: overline;
	}

	h3 {
		text-decoration: line-through;
	}
	

Letter space [letter-spacing]
The spacing between text characters can be specified using the property letter-spacing. The value of the property is simply the desired width.

 
        h1 {
		letter-spacing: 8px;
	}

	p {
		letter-spacing: 5px;
	}

Text transformation [text-transform]
The text-transform property controls the capitalization of a text.

• capitalize
  Capitalizes the first letter of each word. For example: "angel mark" will be "Angel Mark".
• uppercase
  Converts all letters to uppercase. For example: "angel mark" will be "ANGEL MARK".
• lowercase
  Converts all letters to lowercase. For example: "ANGEL MARK" will be "angel mark".
• none
  No transformations - the text is presented as it appears in the HTML code.

 
        h1 {
		text-transform: uppercase;
	}

	li {
		text-transform: capitalize;
	}

Judul: Formatting and Styling Text in CSS
Ditulis oleh Unknown
Rating Blog 5 dari 5