There is a CSS property called text-transform that controls the capitalization of text.
Setting the value of text-transform: uppercase will make all characters uppercase and this is not what we need. In this case we can use ::first-letter selector to apply uppercase only to our first letter.
HTML code:
<div class="capitalize-first-letter">ONLY FIRST LETTER WILL BE CAPITALIZED</div>
CSS:
.capitalize-first-letter {
text-transform: lowercase;
}
.capitalize-first-letter::first-letter {
text-transform: uppercase;
}
You can find the complete example here: codepen.io/xhuljan123/pen/rNMvwjG