Embedding your own fonts on the web
The CSS @font-face rule allows you to specify & upload a font that will be downloaded to the clients machine, so the web page will be rendered exactly as you expected it to be, no matter where!
A huge step forward for typography on the web. Mozilla finally announced that its new Firefox 3.5 (download beta) will support the @font-face CSS rule. Opera is supposed to do the same with the next 10 version. It’s worth to know that this feature is working already on Safari (3.1 +) using webkit. Internet Explorer (4.0+) Supports this too, but with .eot or .ote font file extensions only.
Since May 1998 in the CSS 2 specification, every one was interested in being able to embed your own fonts on any web page using @font-face rule. It would help you make sure that your visitors will see your design just as you created it. however this was not implemented on every browser, so it was later removed from the recommendation is CSS 2.1.
The copyright issues! using this method means that any one can go through your code and download the font you are using. This arises a problem since there are many fonts you are not allowed to re-distribute. There should be a way of encoding font files or otherwise we will have to stick with open source fonts, which can’t be the answer!
Using @font-face property
src: url('http://web-site.com/MyriadPro.otf') format('opentype');
font-family:'Myriad Pro', georgia;
<h2>This is Myriad Pro font Example.</h2>
powered by: http://groups.adobe.com/posts/2b5397b1d0