How to use @font-face for web page?

HTML :)

<link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'> <!-- You can place here any font link from https://www.google.com/fonts -->

<h1>Hello World</h1>

CSS :)

 h1 {
   font-family: 'Amatic SC', cursive;
}

Output :)