If you’re a designer you may want to check this out, or even use this. ever heard of @font-face(well let me introduce breifly)@font-face is not exactly a feature which is new to CSS 3 world, since CSS 2 it has been proposed by and has been implemented in Internet Explorer ever since ie 5, the thing is IE still rely on open Type (.eot) format which is no other browsers decided to use. then here comes True type (.ttf) which comply majority of the browsers(not to mention safari supports both type format (.ttf and .otf) in their pages haha…)
enough said… here’s how we do it
Okay, each form of the font family must be declared using the @font-face syntax; for example, i want to use “Calibri” as my global font, I should place it on my CSS stylesheet this way:
font-family: ‘Calibri’;
src: url(‘font/Calibri.eot’) format(‘eot’),
url(‘font/Calibri.ttf’) format(‘truetype’);
}
as you can see I placed those font on a “font” directory. if you place those font formats somewhere else, just change the directory.
this –> ‘font/Calibri.eot’ to be change with –> ‘-directory-/Calibri.eot’ (do the same with ttf)
Then on your CSS stylesheet call it using font-family:
font-family: ‘Calibri’;
/** and more elements here **/
font-size:2.3em;
font-weight:bold;
/** etc **/
}
p {
font-family: ‘Calibri’;
/** and more elements here **/
font-size:1.3em;
font-weight:bold;
/** etc **/
}
Note: some fonts don’t have their open type (.eot) formats so here’s a link than may help you convert those (.ttf) to (.eot) formats. http://ttf2eot.sebastiankippe.com/
wholla! that’s it 
hope it help… enjoy
Follow me on...
Categories
Archives
Very interesting, but I’m still frightened by the incompatibility of the browsers, which seems to me unacceptable!
Hi Aurelio, thanks for droppin’ by, we’ll eventually as of now all latest browsers support font-face.
try it out. 
Interesting . thanks for info
First of, your site looks brilliant.
@fontface, read a lot about it but never tried it. With this clean and clear explanation it’s time to give it a shot. Thanks for this!
Does this work in WordPress? I installed a fresh copy of wordpress and used the default template. I put the css code in the style.css file near the top. However, it didn’t work. What do you suggest? Thanks!
Hi there Cindy,
This will work on wordpress and default template
… if it didn’t work maybe you would like to double check the directory where you put the fonts.. like for example i place it on “wp-content/theme/twenty-eleven/font” so on the twenty-eleven default style css sheet i can put this code below:
@font-face {
font-family: ‘Calibri’;
src: url(‘font/Calibri.eot’) format(‘eot’),
url(‘font/Calibri.ttf’) format(‘truetype’);
}
2nd thing is to check whether the fonts your using is an eot format or a truetype format..
3rd try to check whether you call the fonts the right way
for example you should call it like this
#header h2 {
font-family: ‘Calibri’; {
/** the font is opened and closed with an apostrophe **/
4th’ly try to double check the apostrophes, commas, semi-colons on your code..
5th if this didn’t helped at all maybe you can send me the link of your site..
have a great day.. 
Must say this is great. I was in need of something like this..Now I can use the fonts i want!!!!
thanks.