How to add a non-standard font to a website with CSS?

To add a non-standard font to a website with CSS, we use the @font-face rule.

For instance, we write

@font-face {
  font-family: "My Custom Font";
  src: url(http://www.example.org/mycustomfont.ttf) format("truetype");
}
p.customfont {
  font-family: "My Custom Font", Verdana, Tahoma;
}

to add the My Custom Font font with @font-face using the font-family and src properties.

We set src to the font URL with url.

And then we set the font-family to 'My Custom Font' to use it.