Ramesh Kumar
Mobile Application Development and Downloads

HTML Tutorials : Custom Font in IE - Problem Displaying Custom Font IE 9

How to display Custom Font in all browsers


Follow these steps to get Custom Font in your website

Need custom fonts in your website? Now its ease to implement the custom font into your website.

  • Decide the font you want to add in your website.
  • Convert the font to ".EOT, .ttf, .woff, .svg"
  • You can convert your font format to EOT and ttf format for free from http://www.font2web.com/
  • You can convert your font format to svg format for free from http://www.freefontconverter.com/
  • You can convert your font format to woff format for free from http://orionevent.comxa.com/otf2woff.html
  • Now you will be having font with .EOT, .svg, .woff format. Almost Done !!!
  • Add the below code into stylesheet file

    @font-face
    {
    font-family:'Font_Name';
    src: url('Font_Name.eot');
    src: local('☺'), url('Font_Name.woff') format('woff'), url('Font_Name.ttf') format('truetype'), url('Font_Name.svg') format('svg');
    }

    Now add this code into the same css file

    h1
    {
    font-family:Font_Name;
    font-size:36px;
    }
IMPORTANT: Place all your converted fonts into your website/folder and should give parh to the .css file.
Now you will get the custom font in your html file wherever you use <H1> Custom Text Here <H1/> Tag

*Check license of the font you are converting.

Go Back
  Home | About Me | Mobile Downloads | Media Downloads | SiteIndex | Contact