Check out a free preview of the full Introduction to HTML5 and CSS3 course:
The "CSS3 Text: @font-face & Shadows" Lesson is part of the full, Introduction to HTML5 and CSS3 course featured in this preview video. Here's what you'd learn in this lesson:
Use @font-face to set fonts – different font files are supported by different browsers pretty much breaking out by IE and then everyone else. An interesting blog to check out for font face implementation is: http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/ . Use http://fontsquirrel.com and Google Fonts for commercially-free fonts or www.typekit.com for licensed fonts. Since font files are notoriously large, gzip them or try the new file format, WOFF of already-compressed files complete with font metadata http://hacks.mozilla.org/2009/10/woff/ , which vendors love. Text-shadow and bevel text-shadow is really easy to use by just setting the “glow” pixels and color. You can set more than one value for text-shadow. Setting the text to white and applying a text shadow, called “Solar Text-Shadow” needs to have a back-up color set, just in case.
