It is very important to follow exactly what is given here in order to use Arpant Dynamic Font and that works on most of the browsers properly .

The first step is to upload the eot file and ttf file into a folder on your Web Server, the next step is to load these files to browser ( using stylesheets ) whenever your website is accessed.

FOR INTERNET EXPLORER 6.0+

You can change the location of the eot file (url) and font-family name .

src (url) : it is the full path on your server where the eot file you have uploaded. You should change this path as it suits to your environment. You should only change the url portion.

<!--[if IE]>
<style type="text/css">
/* Font rule for MSIE referencing EOT font */

  @font-face {
    font-family:"OdiaDynFont"; /* Give a suitable name */
    font-style:  normal;
    font-weight: normal;
    src: url(/eot/APUNIAP0.eot); /* Location of the eot file on your server */
  }
</style>
<![endif]-->

FOR NON-IE BROWSERS ( ie, Firefox, Chrome, Safari, Opera etc.)

<!--[if !IE]>-->
<style type="text/css">

/* Font rule for other browsers referencing TTF font 

src (url) : it is the full path on your server where the ttf file you have uploaded. You should change this path as it suits to your environment. You should only change the url portion.

*/
@font-face {
    font-family:"OdiaDynFont"; /* Give a suitable name */
    font-style:  normal;
    font-weight: normal;
    src: local("'APUni Aprant Web'"), url(/eot/APUniAprantWeb.ttf) format("truetype") ;
}
</style>
<!--<![endif]-->

Important Note : Make sure the above stylesheet portion appears as the first stylesheet code under your HTML head section before you load any other css files. This way, you assure the browser that font is alrady loaded prior to any CSS files that might refer to the dynamic fonts. It is a best practice to follow this note.

Once you define the font-family for dynamic font definited above and instruct the browser to load the dynamic fonts, define your own stylesheet with classes. See the following example. In our example the name of the dynamic font above is OdiaDynFont

<style>
.odia16{
font-family:OdiaDynFont,'APUni Aprant Web','APUni Aprant';
/* We have also included above the local fonts as well */
font-size:16px;
line-height:26px; /* Adjust this value as per your requirement. */
}

.odia18_bold{
font-family:OdiaDynFont,'APUni Aprant Web','APUni Aprant';
/* We have also included above the local fonts as well */
font-size:18px;
line-height:30px; /* Adjust this value as per your requirement. */
font-weight:bold;
}

</style>

Now you can use the above CSS classes to any DIV / SPAN elements which contains Odia Unicode Text in your HTML file.