CSS text-transform – capitalize, uppercase and lowercase text

CSS property text-transform controls capitalization effects of an element’s text

CSS property text-transform

CSS version: CSS 2.1
Value: capitalize | uppercase | lowercase | none | inherit
Initial: none
Applies to: all elements
Inherited: yes

text-transform values

noneNo capitalization
capitalizePuts the first character of each word in uppercase; other characters are unaffected.
uppercasePuts all characters of each word in uppercase.
lowercasePuts all characters of each word in lowercase.
inheritinherit value from parent

Example – text-transform

span {margin: 5px; background-color:lightgray;}
.cap {text-transform: capitalize;}
.uc {text-transform: uppercase;}
.lc {text-transform: lowercase;}

<span class="cap">capitalize example</span>
<span class="uc">Uppercase example</span>
<span class="lc">Lowercase example example</span>



Share this article: share on Google+ share on facebook share on linkedin tweet this submit to reddit


Click here to write/view comments