Embedding Fonts into Web Page

Comments Off    Share on Facebook
ShortLink:

Very handy way to add a signature or some special font to a website.

Here is how I did it and it works in IE, Firefox, and Safari even on the iphone!
here is what I added to the styles area:

<style type=”text/css”>
<!–
@font-face
{
font-family: “myspecialfontname”;
src: url(http://www.yourwebsite.com/fonts/THEFONT_.TTF) format(“truetype”);
}
.bigwillystyle { font-family: “myspecialfontname”, sans-serif }
–>
</style>

this is where I used it
<p style=”font-size: 24px; font-family: myspecialfontname;”>Will  Rogers</p>

I think you can do it this way too, but I haven’t tried it:
To avoid long lists of @font-face declarations in the style sheet, they can be hidden using @import” like so,

@import url(http://www.yourwebsite.com/fonts/index.css) all;
myspecialfont { font-family: thefontname, serif }

Link to where I got this

Comments are closed.