Easy Webbers About Authors Contact Us Advertise Login


Ads by AdBrite.

Embedding Fonts on a Page

Posted by Simon on September 5th, 2006 in CSS

You want to use a special font to your titels on your blog or website but you know that your visitors won’t see it if they don’t have the font installed on their computers. One solution to fix this problem is to embed a font in a page. Open up your CSS document:

1. Type @font-face {

2. Type font-family: “name”; where name is the full name of the font you want to embed.

3. Next you must indicate where the embedded font can be found by typing src: url(font.eot) (font.eot is the location of the font on your server)

4. Don’t forget to close the code by writing }

It would look something like this:

@font-face {font-family: "name";
src: url(font.eot)
}

AddThis Social Bookmark Button

Get paid to review this post: Earn $7.50 by making a review about this post on your own blog. Click here for more information!

7 Responses to “Embedding Fonts on a Page”

  1. newdisco Says:

    does this works on all browsers?

  2. Simon L Says:

    All browsers that can handle css properly, yes.

  3. Santiago Says:

    src dont scr :)
    http://www.w3.org/TR/REC-CSS2/fonts.html#font-descriptions

  4. Simon Says:

    Santiago, you are so correct. How could that have slipped by!? Oh well, it is now changed and updated. Thank you. :)

  5. juan záyago Says:

    and what´s the .eot ????

  6. Jatinder Says:

    Embedded Open Type

  7. Danimissy Says:

    Good article, but where i can find or download the .eot file?

Leave a Reply