How to change CSS for converting text to upper case, lower case, or to capitalize

In menus, sidebars or in heading we often require to change the text properties from uppercase to lowercase. Changing the whole contents is not possible on different pages and the best solution is the transform the texts from CSS controls. The CSS property used to defined the change is “text-transform: value”.

The various possibilities of the transforms are uppercase, lowercase, capitalize , inherit or none.

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

• text-transform: none – It is the default property where is takes the default value of text.
• text-transform: uppercase – It convert the whole set of text into uppercase i.e output will be “TRANSFORMED TO UPPERCASE”.
• text-transform: lowercase – It convert the whole set of text into lowercase i.e output will be “transformed to lowercase”.
• text-transform: capitalize – It transform the first letter of every word into capital letter i.e output will be “Transformed To Capitalize”.