add font to css

@font-face {
  font-family: "Open Sans";
  src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
       url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
}

@font-face {
  font-family: myFirstFont;
  src: url(sansation_bold.woff);
  font-weight: bold;
}
 

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

div {
  font-family: myFirstFont;
}
/*Name the font-family and link the font file in the @font-face rule*/

/* Answer to: "add font to css" */

/*
  In the @font-face rule; first define a name for the font 
  (e.g. myFirstFont) and then point to the font file.

  Tip: Always use lowercase letters for the font URL. Uppercase
  letters can give unexpected results in IE.

  To use the font for an HTML element, refer to the name of the
  font (myFirstFont) through the font-family property:
*/

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

div {
  font-family: myFirstFont;
}

/*
  For more information, go to:
  https://www.w3schools.com/css/css3_fonts.asp
*/

@import url(//fonts.googleapis.com/css?family=Open+Sans);
/*When not hosting on my own server use the @import rule which is Google Fonts Versionn and hosted on their server*/

/************* How to embed fonts using GOOGLE FONTS? ******************
This will ensure that the Font type of your choice will appear for all 
users, regardless of whether or not they have this Font installed!


1º -  Go to https://fonts.google.com/


2º - Choose a Font and, for that particular choice, you mark the option: 
     "Select this style". Do this for every Font you wish to incorporate


3º - In the page of your "Selected Family", go to the option "Embed"


4º - Copy the link and paste in the <header> of your html file: */
<link href="https://fonts.googleapis.com/css2?family=..." 
  rel="stylesheet"> /*


5º - Finish by copying the "CSS rules to specify families" that the site 
gives you and (in your css file) pasting a new property to your element, 
for exemple: */

h1 {
  font-family: "Sacramento", cursive;
}