Use Custom Fonts With CSS

This blog post will explain how to use custom fonts with css.

Here is the css code that is needed to make it work. A font-face at rule is defined. Inside it, font-family is set to custom. The src property will be set to the url of the chosen font that is to be used. A .custom-font class is created. Inside it, font-family is set to custom.

@font-face
{
  font-family: custom;
  src: url(font.woff);
}

.custom-font
{
   font-family: custom;
}

Here is the html code needed to make it work. The class within the p element will be set to custom-font.

<p class = "custom-font">Hello world.</p>

Leave a Reply