CSS font Property:-

Description
The font CSS property sets the style, variant, boldness, size/line-height, and the font family for an element's text content. It is a shorthand property for setting the individual font properties i.e. font-style, font-weight, font-size, font-variant, line-height, and font-family in a single declaration.

Syntax
The syntax of the property is declared as follows,

font: [ font-style font-variant font-weight font-size/line-height font-family ] | caption | icon | menu | message-box | small-caption | status-bar | initial | inherit

The example below shows the font property in action.

h1 {
  font: bold 3.5em Arial, Helvetica, sans-serif;
}
h2 {
  font: normal 1.2em "Times New Roman", Times, serif;
}

CSS font-family Property:-

Description
The font-family CSS property sets the font face to be used for the element's text content. The font-family property should hold several font names as a "fallback" system. Start with the font that you want first, then any fonts that might fill in for the first if it is unavailable.

You should end the list with a generic font family, which are five: serif, sans-serif, monospace, cursive, and fantasy. The following table summarizes the usages context and the version history of this property.

Syntax
The syntax of the property is given with,

font-family:
[ family-name | generic-family ] [, family-name | generic-family ]one or more pairs | initial | inherit

The example below shows the font-family property in action.

body {
  font-family: "Times New Roman", Times, serif;
}
h1 {
  font-family: Arial, Helvetica, sans-serif;
}