What CSS property is used to change the font face?

We can use the font-family property for achieving this. The font-family property is used for specifying what font needs to be applied on the targetted DOM element. It can hold several font names as part of the “fallback” mechanism in case the browser does not support the fonts. For example, we can use:

p {
  font-family: "Times New Roman", Times, serif;
}

In the above piece of code, we are applying font-family property to the paragraph element.

  • It tells the browser to look for the “Times New Roman” font and apply it.
  • If the “Times New Roman” font is not installed or supported, then it asks the browser to use Times font.
  • If both “Times New Roman” and Times are not supported, then it asks the browser to use any supported generic font belonging to serif.

If you do not want the font-face of the paragraph element to be Times New Roman/Times/serif font, and you want to use the Arial/Helvetica/sans-serif font, then we can just update the CSS property of the paragraph element as:

p {
  font-family: Arial, Helvetica, sans-serif;
}