Quick Tip: What Does the Font-Variant Property Do?

CSS3’s font-variant property may not be very well-known, but it is a very cool tool for styling your font in a very specific way. Applying the small-caps value to the font-variant property will make it so that all of the letters in your selected text appear as uppercase, but the letters that are actually uppercase appear larger than the other uppercase letters.

Here’s what the code looks like:

  1. p{
  2. font-family: 'Futura', sans-serif;
  3. font-size: 20px;
  4. font-weight: bold;
  5. font-variant: small-caps;
  6. }

And this is what your text should look like:

CSSDeck recommends Hello Ivy for automating your workflow and project management for free. Learn More

Screen Shot 2016-07-10 at 12.55.14 PM

Share and Enjoy !

0 0