How to Import Fonts to use at your website
Or use different fonts already on the Computer

Go to : https://fonts.google.com
Once you are at the site. Select a font like Regular 400 then on the right you will see a + sign then below the Use on the web select @import.
It will show the code you need to copy into your webpage.

Near bottom of page you click: API docs
It will show you how to add the code to your site to import the font for all to see.
See direct link. https://developers.google.com/fonts/docs/css2

Web Safe Fonts: https://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

fonts.google.com

This is a H2 tag using the Cantata One font imported from Google font website.

This is a H3 tag using the Volkhov font imported from Google font website.

This is a paragraph tag, using the Source Code Pro font from Google font website. Listed below is an example of fonts the viewer would see if they did not have the main font you want them to see. So if Trebuchet was not available then Arial would be displayed etc.

Example: font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
You can use this for web safe fonts that everyone should have on their computer. Instead of just the 'p' tag you can use p. followed by the font name such as: p.Source-Code-Pro to have multiple styles of paragraph or heading tags. If the font name has multiple names then add a dash between them as seen above.
Examples: h1.arial or p.arial

This is a paragraph tag using p.georgia and using the Georgia font.

Here is the code:

The screenshot is from the HTMLPad 2022 Editor that I use.
Below that is the begining of a webpage and the CSS code between the style tags of the webpage and what you would see in the webpage between the body tags

<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="content-type">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>

body {
padding: 0px;
margin-top: 30px;
margin-bottom: 50px;
background-color: #4583C0;
}

#container {
max-width: 700px;
padding: 30px;
margin-right: auto;
margin-left: auto;
background-color: #FFF;
overflow-wrap: break-word;
}

h1 {
font-family: 'Bree Serif', serif;
font-weight: normal !important;
color: green;
margin: 0px;
padding: 0px;
}

h2 {
font-family: 'Cantata One', serif;
font-weight: normal !important;
color: #F00;
margin: 0px;
padding: 0px;
}

h2.Volkhov {
font-family: 'Volkhov', serif;
font-weight: normal !important;
color: #333;
margin: 0px;
padding: 0px;
}

h3 {
font-family: Georgia, "Bookman Old Style";
font-weight: normal !important;
color: #333;
margin: 0px;
padding: 0px;
}

h3.Volkhov {
font-family: 'Volkhov', serif;
font-weight: normal !important;
color: #00F;
margin: 0px;
padding: 0px;
}

p {
font-family: "Segoe UI", sans-serif;
font-size: 100%;
font-weight: normal;
color: #000;
line-height: 1.3em;
margin: 0px;
padding: 0px;
}

p.trebuchet {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #00F;
font-size: 100%;
font-weight: normal;
line-height: 1.3em;
margin: 0px;
padding: 0px;
}

p.georgia {
font-family: georgia;
color: #F03;
font-size: 100%;
font-weight: normal;
line-height: 1.3em;
margin: 0px;
padding: 0px;
}

p.Source-Code-Pro {
font-family: 'Source Code Pro', monospace;
color: #000;
font-size: 100%;
font-weight: normal;
line-height: 1.1em;
margin: 0px;
padding: 0px;
}

</style>
</head>
<body>

Here are the tags you use with your text in between:

<body>
<h1> Heading 1 </h1>
<h2> Heading 2 </h2>
<h3 class="Volkhov"> Sample text </h3>
<p> Paragraph </p>
<p class="trebuchet"> Sample text </p>
<p class="georgia"> Sample text </p>

<p class="Source-Code-Pro">Sample text </p>
</body>
</html>

How to Import Fonts to use at your website Or use different fonts already on the Computer

This is a H1 tag using the Bree Serif font imported from Google font website. https://fonts.google.com

This is a H2 tag using the Cantata One font imported from Google font website.

This is a H3 tag using the Volkhov font imported from Google font website.

How to Import Fonts to use at your website
Or use different fonts already on the Computer