@font-face embedding in detail
Zoltan Hawryluk walks us on how to embed @font-face via CSS, which’s supported in “Firefox 3.5+ , Safari 3.1+, Opera 10+, Google Chrome, and Internet Explorer 4.0+. Although technically embedding any font inside a web page is possible, but its important to have a license for commercial font. Here’s an example using via CSS:
@font-face {
font-family: 'Droid Sans';
src: url('/shared/fonts/DroidSans/DroidSans.eot');
src: local('Droid Sans'),
local('Droid Sans'),
url('/shared/fonts/DroidSans/DroidSans.ttf') format('truetype');
}
/* Bold declaration only for non-IE browsers */
@font-face {
font-family: 'Droid Sans';
src: local('Droid Sans Bold'),
local('Droid Sans-Bold'),
url('/shared/fonts/DroidSans/DroidSans-Bold.ttf') format('truetype');
font-weight: bold;
}
body {
font-family: "Droid Sans", "Arial", "Helvetica", sans-serif;
}
Full Article: @font-face

Leave a comment »