CSS for @font-face

Nice Web Type has the CSS for @font-face. Whenever I play with this, I always forget it, and so I’m simply pasting what I need to remember here:

@font-face {
font-family: “Your typeface”;
src: url(“type/filename.eot”);
src: local(“☺”),
url(“type/filename.woff”) format(“woff”),
url(“type/filename.otf”) format(“opentype”),
url(“type/filename.svg#filename”) format(“svg”);
}
@font-face {
font-family: “Your italic typeface”;
src: url(“type/filename-ital.eot”);
src: local(“☺”),
url(“type/filename-ital.woff”) format(“woff”),
url(“type/filename-ital.otf”) format(“opentype”),
url(“type/filename-ital.svg#filename-ital”) format(“svg”);
}
h2 { font-family: “Your typeface”, Georgia, serif; }
h2 em { font-family: “Your italic typeface”, Georgia, serif; }
em { font-style: italic; }

(Visited 27 times, 1 visits today)

Leave a Reply