Set a family and fallback
A CSS declaration such as font-family: "Lora", serif; requests Lora first and then a generic serif. Put it on the selector for the text you want to style.
Naming a family does not itself provide its font files. Use an appropriate web-font stylesheet or a configured font resource when the visitor cannot be expected to have the family installed.
Keep weight and size separate
Choose the family first, then set the intended weight and size. For example, a title and a paragraph can share one family while using different authored styles.
The CSS font-weight guide explains why the requested weight must be supported by the font that actually loads.
Inspect the real rendered result
Compare a long heading, a paragraph and a label at the intended widths. If a request falls back, the text can remain visible while its spacing changes.
Keep the design’s source URL and style list with the project. That helps another editor distinguish a missing web resource from a simple visual preference.
Choose a real font rather than a lookalike alphabet
Our font library provides real specimens and stylesheet examples. A Unicode text tool changes the characters themselves and answers a different task.
For a coordinated heading and body, compare font pairing ideas before adding several unrelated families to the page.
Your questions, answered.
Does font-family download a font by itself?
No. The requested family must already be available or supplied through a suitable font-loading setup.
Why does text remain visible in the wrong style?
The browser can use a fallback when the requested family or a needed glyph is unavailable.
Is CSS bold the same as changing family?
No. Family and weight are separate choices.
Sources & background
Sources supporting this page’s explanations. Practical examples are our editorial suggestions.