Are there any way to use custom font file in my site ?

Question

I can use @font-face but it does not work in all browsers.

Are there any way to use custom font file in my site ?

Answer 1

The @font-face rule should work in all modern browsers - even IE6+.

The trick is ensuring you have the right syntax and font formats that each browser caters to. For example:

@font-face {
    font-family: 'PT Sans';
    src: url('fonts/PT_Sans-webfont.eot');
    src: local('☺'), url('fonts/PT_Sans-webfont.woff') format('woff'), url('fonts/PT_Sans-webfont.ttf') format('truetype'), url('fonts/PT_Sans-webfont.svg#webfontTrsHPjCJ') format('svg');
    font-weight: normal;
    font-style: normal;
}

Notice we have EOT, WOFF, TTF and SVG for good measure. Chrome and Firefox can use WOFF and TTF, IE uses SVG and EOT.

Also ensure you have each font file's location set correctly.