Formatting Text with StylesStarting with ECLoc7276 Ch10 - 144_Formatting_Text.html

Example on ECLoc7301 shows La Sagrada Familia.

Font-family is an inherited property. If it is specified in the body element all elements in the page take on the style.

Some elements refuse to inherit their parent's font setting, such as select, textarea, and input. One can force them by { font-family: inherit; }

The example on ECLoc7336 uses font-family Geneva and Gill Sans which are common on OS X, but Windows does not have it. If you choose a font that is not installed on your visitor’s system, their browser will use the default browser font instead. Times New Roman is the default on Windows.

Testing what happens when I specify font-family as Geneva and alternatives are Lucida Handwriting and Arial.

Testing what happens when I specify font-family as Geneva and alternatives are Impact and Arial.

These two examples above show how alternate font-family is selected when a certain font is not available in the browser.

A list Microsoft Fonts is listed in the article.

There is a very limited list of fonts to choose from that both OS X and Windows have by default: Arial, Comic Sans MS, Courier New, Georgia, Impact, Trebuchet MS, Times New Roman, and Verdana.

A complete collection of web safe CSS font stacks is available.

To create italics, use font-style: italic - The font-style property is inherited.

Normally, browsers typically style the h1-h6 headings in bold by default, but it may be turned off by font-weight: normal;.

Type a multiple of 100 (up to 900), where 400 typically represents normal weight (that is, not bold) and 700 is the same as typing bold.

HelveticaWeightScale shows how some of the bold definitions display in Helvetica.

When you use relative font sizes it’s best to establish a baseline on the body element; you do that by declaring body { font-size: 100%; }

Most of the time, this sets the size to the equivalent of 16px, because that is the default font size in most browsers.

In this case, 1em is equivalent to 16px, because it is default for elements.

You can set the font style, weight, variant, size, line height, and family all at once with the font shorthand property.

More about background sizes.

Most of the new background styles are covered here.

I stopped at ECLoc8483 P265