Web & graphic design notes

Small capitals

Small capitals (aka small caps) are uppercase (capital) characters set at the same height as surrounding lowercase (small) letters. They are used in typing text to prevent capitalized words from appearing too large on the page, and as a method of emphasis for text alongside or instead of italics, or when boldface we don't want to use in the document.

The font-variant css paramert is used showcase the text in a small-caps font. This means that all the lower case letters are converted to uppercase letters, and all the letters in the small-caps font have a smaller font-size compared to the rest of the text.

 
p {
 font-variant: small-caps; /* Small capitals */
 font-size: 150%; /* Font-size */
}
 
 
 
<p>Sample text goes here</p>

The result will look: