Webfonts Explained

Unlike web safe fonts a webfont is a special font used on websites using the CSS @font-face declaration. A webfont has four flavors. A TrueType, WOFF, EOT and an SVG file. To target in different browsers each one is designed. You will require all four files when using webfonts for a website.

You can get sample webfonts from here.

Webfonts for HTML:

<link href="http://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet" />
<h1>This is my pretty and good webfonts!</h1>

CSS:

h1{
    font-family: Satisfy, cursive;
    font-weight:normal;
    font-size:22px;
    padding-top: 40px;
}