CSS

text-transform

Property

Example

Transform text in different <div> elements:

div.a {
  text-transform: uppercase;
}

div.b {
  text-transform: lowercase;
}

div.c {
  text-transform: capitalize;
}

Try it Yourself »

Definition and Usage

The text-transform property controls the capitalization of text.

Show demo ❯

Default value:
none

Inherited:
yes

Version:
CSS1

JavaScript syntax:
object.style.textTransform=”uppercase”
Try it

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property

text-transform
1.0
4.0
1.0
1.0
7.0

CSS Syntax

text-transform: none|capitalize|uppercase|lowercase|initial|inherit;

Property Values

Value
Description
Demo

none
No capitalization. The text renders as it is. This is default
Demo ❯

capitalize
Transforms the first character of each word to uppercase
Demo ❯

uppercase
Transforms all characters to uppercase
Demo ❯

lowercase
Transforms all characters to lowercase
Demo ❯

initial
Sets this property to its default value. Read about initial

inherit
Inherits this property from its parent element. Read about inherit

Related Pages

CSS tutorial: CSS Text
Transformation

HTML DOM reference: textTransform property