Javascript DOM CSS Style textTransform Property

Introduction

Transform the first letter of each word in a <p> element to uppercase: 

document.getElementById("myP").style.textTransform = "capitalize";

View in separate window 

<!DOCTYPE html>
<html>
<body>

<p id="myP">This is an example paragraph.</p>

<button type="button" onclick="myFunction()">Transform text</button>

<script>
function myFunction() {//  w  w  w . j a v  a2 s  .c  o m
  document.getElementById("myP").style.textTransform = "capitalize";
}
</script>

</body>
</html>

The textTransform property sets or gets the capitalization of a text.

This property is used to change the text to uppercase, lowercase or to capitalized.

Property Values

Value Description
none No characters are transformed. default
capitalize The first character of each word is transformed to uppercase
uppercase All characters are transformed to uppercase
lowercase All characters are transformed to lowercase
initialSets this property to its default value.
inheritInherits this property from its parent element.

The textTransform property returns a String representing the transformation of the text in the element.




PreviousNext

Related