CSS - text-transform


Description

The text-transform property changes the capitalization of text within an element, or else directs the user agent to leave the capitalization "as is."

Possible Values

  • capitalize − The first letter of each word in the element's text should be capitalized.

  • uppercase − All of the characters in the element's text should be uppercase (capital letters).

  • lowercase − All of the characters in the element's text should be lowercase.

  • none - The capitalization of the element's text should not be altered.

Applies to

All the HTML elements.

DOM Syntax

object.style.textTransform = "uppercase";

Example

Following is the example which demonstrates how to set the cases for a text using text-transform property.

<html>
   <head>
   </head>

   <body>
      <p style = "text-transform:capitalize;">
         This will be capitalized
      </p>
      
      <p style = "text-transform:uppercase;">
         This will be in uppercase
      </p>
      
      <p style = "text-transform:lowercase;">
         This will be in lowercase
      </p>
   </body>
</html> 

This will produce following result −

Advertisements