From W3C Wiki
Jump to: navigation, search


The text-transform property controls capitalization effects of an element's text.


Values capitalize | uppercase | lowercase | none | inherit
Initial value none
Applies to All elements
Inherited Yes


  • capitalize
    Puts the first character of each word in uppercase; other characters are unaffected.

  • uppercase
    Puts all characters of each word in uppercase.

  • lowercase
    Puts all characters of each word in lowercase.

  • none
    No capitalization effects.

  • inherit
    Takes the same specified value as the property for the element's parent.


Example A


p#no{ text-transform: none; }
p#cap{ text-transform: capitalize; }
p#up{ text-transform: uppercase; }
p#low{ text-transform: lowercase; }


  <p id="no">This is a paragraph(none)</p>
  <p id="cap">This is a paragraph(capitalize)</p>
  <p id="up">This is a paragraph(uppercase)</p>
  <p id="low">This is a paragraph(lowercase)</p>

Csslist2 text-transform.png

CSS Reference

The CSS specification defines the text-transform property in 16.5 Capitalization.