CSS text-transform

The CSS text-transform property is used to control captialization of text. For example, you can force text to be uppercase, lowercase, or title case (capitalized).

In the above example, pay particular attention to the way the text has been entered, and how it is rendered after having the text-transform property applied. You'll notice that captalize is only applied to the first character, whereas the other two are applied to the whole word.

Syntax

text-transform: none | capitalize | uppercase | lowercase | full-width

Possible Values

none
No effects are applied to the text.
capitalize
First character of each word is rendered in uppercase. The remaining characters are rendered as they are.
uppercase
All characters are rendered in uppercase.
lowercase
All characters are rendered in lowercase.
full-width
Puts all characters in fullwidth form. If the character does not have a corresponding fullwidth form, it is left as is. This value is typically used to typeset Latin characters and digits like ideographic characters.

In addition, all CSS properties also accept the following CSS-wide keyword values as the sole component of their property value:

initial
Represents the value specified as the property's initial value.
inherit
Represents the computed value of the property on the element's parent.
unset
This value acts as either inherit or initial, depending on whether the property is inherited or not. In other words, it sets all properties to their parent value if they are inheritable or to their initial value if not inheritable.

General Information

Initial Value
none
Applies To
All elements
Inherited?
Yes
Media
Visual

Example Code

h1 { 
  text-transform: uppercase;
  }

Official Specifications