How can a generic family value be a value for font family?

Question

I've seen people doing like this,
p
{
font-family: consolas, courier, monospace;
}
( first values differ, the point here is peoples putting a generic family value at the end )
In this case, consolas and courier are font families whereas monospace is a generic family. Is there a default font-family for all generic families (serif, sans-serif and monospace) that css parser, the browser or whatever it is that processes the css code picks? Or how does that work?

Answer 1

They do it coz if the user's net is too slow, and it can't load an external font, they could use an internal font such as monospace or sans-serif,

Answer 2

Monospace, serif and sans-serif are general names for the fonts what the generic family says (for example; monspaced fonts are the ones where all letters width in the font is equal or for sans-serif, they are the fonts whose letters do not include any serifs). So, what I am saying is, as these are (monospace, serif or sans-serif) just the general names for the fonts, what does the browser replace the font family with when generic family is used at the end (if the font family values given are not available)?

Answer 3

Mustafa K.

I think every browser or a user-agent has some default fallback generic fonts to use when the user defined fonts are not available.

Let's say I want a element to have monospace font and I want it to be specifically Roboto Mono. But if somehow the browser could not load the font that I specified, I can add a fallback generic family monospace like this:
CSS:
-----------
#monospace{
font-family: 'Roboto Mono', monospace;
}
-----------

I've created a example to show how fallback works:
https://code.sololearn.com/WSW66d5Q49Se/?ref=app

See this page:
https://www.w3.org/TR/css-fonts-3/#font-family-prop