Nothing is for sale here. Freewill tips keep the site running. Want to help? → Tip via Paypal
Text Transform
The text-transform property controls the case of the text within an element. There are four possible values:capitalize | uppercase | lowercase | none
Those values have the following meanings:
- capitalize
- Sets the first character of each word in uppercase; other characters are unaffected.
- uppercase
- Sets all the characters of each word in uppercase.
- lowercase
- Sets all the characters of each word in lowercase.
- none
-
No text effect. Go figure.
Here’s how to create a class in an embedded or external style sheet for the text-transform property:
h1.caps {text-transform: uppercase;}
To have all your H1 sized headings displayed in uppercase with that style rule you'd only have to add the caps class to the heading tag. Here’s how:
<h1 class="caps">Your heading goes here.</h1>
Be aware that usability studies have shown that using all capital letters for a long text string makes it harder to read. The most appropriate use is headlines, if you use the uppercase value at all.
