Differences

This shows you the differences between two versions of the page.

Link to this comparison view

css_font_embedding [28.12.2011 12:33]
Pascal Suter created
css_font_embedding [28.12.2011 12:34] (current)
Pascal Suter
Line 14: Line 14:
 upload both ttf and eot files to your webserver and embed it with the folowing lines in your css stylesheet: ​ upload both ttf and eot files to your webserver and embed it with the folowing lines in your css stylesheet: ​
 <​code>​ <​code>​
-@font-face {   +@font-face {  
-   ​font-family:​ " your FontName "; ​  +    font-family:​ " your FontName "; ​  
-   ​src: url( /​location/​of/​font/​FontFileName.eot ); /* IE */   +    src: url( /​location/​of/​font/​FontFileName.eot ); /* IE */   
-   ​src: local("​ real FontName "), url( /​location/​of/​font/​FontFileName.ttf ) format("​truetype"​);​ /* non-IE */   +    src: local("​ real FontName "), url( /​location/​of/​font/​FontFileName.ttf ) format("​truetype"​);​ /* non-IE */   
- }  ​+}  ​
      
- /* THEN use like you would any other font */   +/* THEN use like you would any other font */   
- .yourFontName { font-family:"​ your FontName ", verdana, helvetica, sans-serif; ​  +.yourFontName {  
- }  ​+    ​font-family:"​ your FontName ", verdana, helvetica, sans-serif; ​  
 +}  ​
 </​code>​ </​code>​