Accessing remote fonts on Client’s system by @font-face
@font-face
allows authors to specify online fonts to display text on their web pages. By allowing authors to provide their own fonts.
We Use it
I.We choose font and we have right now. First of all font format generate four another format as like(ttf, eot,otf,svg,woff)
and upload server where we access.
II. Create in css This Syntex
@font-face { font-family: 'PalatinoRegular'; src: url('palatino-webfont.eot'); src: local('Palatino'), local('Palatino'), url('palatino-webfont.woff') format('woff'), url('palatino-webfont.ttf') format('truetype'), url('palatino-webfont.svg#webfontoXFrZcNP') format('svg'); font-weight: normal; font-style: normal; }
III. We acces in html page as class or Id and define body tag font-family
Values
<a-remote-font-name>
Specifies a font name that will be used as font face value for font properties.
<source>
URL for the remote font file location, or the name of a font on the user’s computer in the form local("Font Name")
.
<weight>
A Font-weight value.
You can specify a font on the user’s local computer by name using the local()
syntax. If that font isn’t found, other sources will be tried until one is found.
Note: When not avaible font local machine . This time @font- face download fonts in browser temporary download font and display text
Supported font formats
- Internet Explorer (all versions): EOT
- Safari (3.2+): TTF / OTF
- iPhone (3.1) SVG
- Chrome (all versions): SVG (TTF/OTF added 25th Jan 2010)
- Firefox (3.5+): TTF/OTF (.WOFF added 3.6)
- Opera (10+) TTF/OTF
Browser compatibility
Browser | Lowest version | Support of |
Internet Explorer | 4.0 | Embedded OpenType fonts only |
Firefox (Gecko) | 3.5 (1.9.1) | TrueType and OpenType fonts only |
3.6 (1.9.2) | Web Open Font Format (WOFF) | |
Opera | 10.0 | TrueType and OpenType fonts only |
Safari (WebKit) | 3.1 (525) | TrueType and OpenType fonts only |
## Umar Pahat##
umar@intelligrape.com
www.IntelliGrape.com
mftke26 AIvdl69 fkgzb91 vsXEs66 kqtrH82 tLAfp28