Embedding a font into CSS, but the font does not show up in html file-CodePudding

A bit confused on the process here, but I've tried to embed a new font into a CSS file for an html website, but no matter what I try, the font does not appear on the html site. I've put the font through a converter and then put that entire file into my CSS folder that is in the same file as my index.html, to no avail. Here is the code I've put into CSS:

    font-family: 'Montserrat';
    src: url('Montserrat-SemiBold.woff2') format('woff2'),
        url('Montserrat-SemiBold.woff') format('woff'),
        url('Montserrat-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;

Is there anything I can try to get the code to display properly?

CodePudding user response：

You should add the @font-face keyword to import a font

You should add a

Option 2 (Better) - Load google fonts by CDN

** Better speed performance / Easier to maintain.

<html>
  <head>
    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Tangerine">
    <style>
      body {
        font-family: 'Tangerine', serif;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div>Making the Web Beautiful!</div>
  </body>
</html>