How to set First Character in Each Word to Uppercase using CSS?

CSS Set First Character in Each Word to Uppercase

To set first character in each word of text to uppercase in HTML Element(s) using CSS, assign text-transform CSS property with the value capitalize for the HTML Element(s).

text-transform: capitalize;

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #p1 {
            text-transform: capitalize;
        }
    </style>
</head>
<body>
    <p id="p1">this is a paragraph.</p>
</body>
</html>

Capitalize text in other HTML Elements.

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #h1_1 {
            text-transform: capitalize;
        }
        #a1 {
            text-transform: capitalize;
        }
    </style>
</head>
<body>
    <h1 id="h1_1">my heading</h1>
    <a id="a1">this is a paragraph.</a>
</body>
</html>

Conclusion

In this CSS Tutorial, we learned how to set capitalize each word in the text of HTML Element(s) using CSS.