Using .otf fonts on web browsers

Question

I\'m working on a website that requires font trials online, the fonts I have are all .otf

Is there a way to embed the fonts and get them working on all browsers?

Answer 1

From the Google Font Directory examples:

@font-face {
  font-family: 'Tangerine';
  font-style: normal;
  font-weight: normal;
  src: local('Tangerine'), url('http://example.com/tangerine.ttf') format('truetype');
}
body {
  font-family: 'Tangerine', serif;
  font-size: 48px;
}

This works cross browser with .ttf, I believe it may work with .otf. (Wikipedia says .otf is mostly backwards compatible with .ttf) If not, you can convert the .otf to .ttf

Here are some good sites:

• Good primer:

  http://www.alistapart.com/articles/cssatten

• Other Info:

  http://randsco.com/index.php/2009/07/04/p680