HOLLA TECH - LEARN

The text-transform Property
 

The text-transform CSS property specifies how to capitalize an element’s text. For example, it can be used to make text appear with each word capitalized.

The HTML: 

<p class=“capitalize”>
    The value capitalize transforms the first
    character in each word to uppercase;
    all other characters remain unaffected.
</p>

 

The CSS: 

p.capitalize {
   text-transform: capitalize;
}

 

Result: 

Holla Tech - Learn CSS


text-transform Values
 

Using text-transform property you can make text appear in all-uppercase or all-lowercase. Here is an example:

The HTML:

<p class=“uppercase”>This value transforms all characters to uppercase.</p>
<p class=“lowercase”>This value transforms all characters to lowercase.</p>

 

The CSS: 

p.uppercase {
   text-transform: uppercase;
}
p.lowercase {
   text-transform: lowercase;
}

 

Result: 

Holla Tech - Learn CSS

NOTE!
The value none will produce no capitalization effect at all.

BACK NEXT

CLICK ON THE BUTTON BELOW TO GO TO THE CSS MAIN COURSE PAGE. 

CSS MAIN COURSE PAGE

 


© License: All Rights Reserved 


CONTACT HOLLA TECH – LEARN SUPPORT