CSS3 - HTML5 Mastery: Semantics, Standards, and Styling - page 278

format('woff');
}
The font-family property can then be set to the value of the font-family set
in the @font-face rule:
body { font-family: myFont; }
This will apply the downloaded font to all elements in the body of the web page.
Caution You use a variety of typefaces all the time, but like other bodies of work,
typefaces were designed by someone! This means you are not necessarily legally al-
lowed to use any font you come across. Be sure you are licensed to use the fonts you
choose. For instance, fonts by Adobe Systems can't be used directly as web fonts, even
if you have them installed on your computer! However, a subscription-based service
such as Typekit ( http://typekit.com ) can be used as an intermediary to allow
the use of otherwise restricted fonts.
___________
12 Paul Irish's post on FOUT can be found here: http://paulirish.com/2009/fighting-the-font-face-
fout/
13 See http://www.w3.org/TR/WOFF/
Multiple columns
Creating a text block with multiple columns used to require a lot of different div s
for the different columns in the layout. To ease this markup pain, a new property, the
columns property, has been added. At its most basic, the property can be set to a value
that specifies the number of columns to add, like so:
p.col { columns: 3; }
This will break the paragraph (with a class attribute set to "col" ) into three
columns within its available area. There are number of related properties for getting
more specific with how the columns are displayed; for instance, the gap between
columns can be controlled like a border using the column-gap and column-rule
properties. There is also a column-count property, which is available just for setting
the column count. (The columns property is a shorthand property for these other prop-
erties). For example, the following would produce the layout in Figure 6-26 :
column-count: 3;
column-gap: 2em;
column-rule: 0.35em solid #000;