Using fonts in a webpage

Question

When I use fonts on my webpage, I either use Google Fonts or fonts that are installed on my system. I wanted to know, if it's possible to have a folder with fonts saved in the same folder as the index file, and use those fonts in the webpage without having to install them on the system.

Answer 1

You can use webfonts that live on your server alongside your html and css by referencing them in your css file:

@font-face {
    font-family: "myFont";
    src: url("myFont.ttf");
}

then you can use it as you would a google web font:

html {
    font-family: "Bitstream Vera Serif Bold", serif;
}

More information and examples (including the ones I used) can be found on MDN.