Click here to Skip to main content
Click here to Skip to main content

Tagged as

Using FONTFACE in HTML / Unicode and Non-Unicode Fonts in HTML

, 1 Oct 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
Using external fonts in HTML.

Introduction

This article describes how to use FontFace in HTML document. Even the fonts are not installed on the client's PC, Unicode and non-Unicode text will be rendered properly.

Background 

Basic knowledge of CSS, HTML is enough. And fonts with different format are needed, e.g., *.eot , *.svg, *.woff, *.ttf. These fonts can be automatically generated from HERE.

Using the code  

First of all create a CSS file with FONTFACE. I have shown below.... Here I am using "akrutidevpriya" font-family.

@font-face
{
    font-family: 'akrutidevpriya';
    src: url('apriya-n-webfont.eot');
    src: url('apriya-n-webfont.eot?#iefix') format('embedded-opentype'),
    url('apriya-n-webfont.woff') format('woff'),
    url('apriya-n-webfont.ttf') format('truetype'),
    url('apriya-n-webfont.svg#akrutidevpriyanormal') format('svg');
    font-weight: normal;
    font-style: normal;
} 

Now link this CSS File with HTML file. Just copy and paste the following line in your HTML: 

<link rel="stylesheet" href="styles/MyStyleheet.css" type="text/css" charset="utf-8" />

Feel free to clear any queries.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Dipesh Wadhwa
Software Developer (Junior) Smart Solutions
India India
No Biography provided

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.1411023.1 | Last Updated 1 Oct 2013
Article Copyright 2013 by Dipesh Wadhwa
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid