Just upload the font file you want to use to your server - making sure that you're not violating any copyright rules
In example here I am using font name Ubuntu. you can download this font from here
- then embed it, using the following CSS:
Code:
<html>
<head>
<title>
Test font embeded
</title>
<style type="text/css">
@font-face {
font-family: yourFontName ;
src: url( /ubuntu_title/Ubuntu-Title.ttf ) format("truetype");
}
/* Then use it like you would any other font */
.yourFontName { font-family: yourFontName , verdana, helvetica, sans-serif;
}
</style>
</head>
<body>
<h1 class="yourFontName">ubuntu title</h1>
</body>
</html>
<head>
<title>
Test font embeded
</title>
<style type="text/css">
@font-face {
font-family: yourFontName ;
src: url( /ubuntu_title/Ubuntu-Title.ttf ) format("truetype");
}
/* Then use it like you would any other font */
.yourFontName { font-family: yourFontName , verdana, helvetica, sans-serif;
}
</style>
</head>
<body>
<h1 class="yourFontName">ubuntu title</h1>
</body>
</html>
That's it! Note: the CSS3 specification provides for several font formats: "truetype" (ttf), "opentype" (ttf,otf), "truetype-aat (ttf), "embedded-opentype" (eot) and "scalable-vector-graphic" (svg,svgz).
The result:
