Font Family: A specific font
Generic Family: A collection of font families that look similar to each other
| Generic Family | Font Family | Description |
| Monospace | “Courier New” | All characters have the same width |
| Serif | “Times New Roman” Georgia |
Some characters have lines on the ends |
| Sans-serif | Arial | Characters do not have lines at the end |
In the following example we will change the font of the some <p> tags. If you look at the CSS you will see we have used the property font-family and given it more than one value. The first two values are font families and the last value is a generic family.
Remember to go to files and have a look at the CSS and HTML file.
When you run your website in a browser (Chrome, Edge, Fire Fox) there is a chance that it won’t support a certain font family. If we run this example in Chrome, and it didn’t support Times New Roman, it would try Times. If neither of them are supported, it will choose a similar font from the generic family(serif). We provide multiple font families and a generic family as a ‘just in case’.