Capitalize Text with CSS

To capitalize a string of text using CSS you can use an inline style tag, e.g.-

<div style="text-transform:capitalize;">
this was typed in lower case and capitalized with css
</div>

To create a (reusable) class, add the following to your style sheet (.css) file;

.captxt { text-transform:capitalize; }

then use the following in your HTML;

<div class="captxt">
this was typed in lower case and capitalized with css
</div>

In addition to capitalize, you can also use CSS to transform text strings to upper case or lower case, e.g.-

.uctxt { text-transform:uppercase; }

or-

.lctxt { text-transform:lowercase; }

###

This entry was posted in Fun with CSS and tagged , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>