Reputation: 6668

Using font in Web

Can anyone tell me how to unify the font I use in all browsers in different operating systems ??

Upvotes: 2

Answers (6)

Paul D. Waite

Reputation: 98786

Take a look at the @font-face declaration in CSS.

There’s a good overview on A List Apart:

http://www.alistapart.com/articles/fonts-at-the-crossing

@font-face isn’t super-simple:

different browsers support different font formats (a bit like video in HTML5)
and slightly different syntaxes
and a lot of commercial fonts aren’t licensed for use on the web

However, there are services like Font Squirrel, TypeKit and others that help simplify it.

Upvotes: 1

talkingD0G

Reputation: 413

The simple answer is to add this CSS:

body { font-family: Arial, Helvetica, sans-serif; }

That tells the browser to first look for Arial, then if that's not available use Helvetica (a MAC font that looks like Arial), and then if that's still not available to use a sans-serif font, meaning a non-footed font (Times New Roman is a footed font).

There are only a few cross-browser compatible fonts available now: http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html

As posted earlier, the Google Font API is a good alternative as well.

Upvotes: 1

Jakub

Reputation: 20475

If you want a Javascript solution, try: Typeface.js I have seen a couple web designers use this (for headers and small font areas, but not full page fonts, as this js has some limitations).

Give it a look, may fit your need. However users without JS enabled will not take advantage of it.

Upvotes: 0