Define Styles on the Web

Most popular word processors today have a feature called styles . They enable you to define the kinds of information that will appear in a document ”such as headlines, body text, and pictures ”and then give each of them its own specific formatting.

For example, you could establish that all body text in your document will be 12-point Courier New text that is indented .25 inches from the left margin. After you have set up this rule for body text, you can apply the style to all paragraphs that are part of the document's main body. They'll show up exactly as if you applied the font and formatting directly. Later, if you decide to pick a different font or font size, you can modify the body text style instead of changing the document itself. All body text will change accordingly .

This idea has been introduced to the World Wide Web through Cascading Style Sheets ( CSS ) , a new language that specifies how a Web page and its elements should look. Cascading Style Sheets are an extension of HTML, rather than a replacement. A Web page incorporates CSS commands as hidden sections of the page, or on separate pages that contain all CSS formatting information.

Currently there are three versions of CSS, which were first supported in version 3.0 of Internet Explorer and version 4.0 of Navigator. CSS 1.0 is most widely supported in current browsers, and it contains commands to set the fonts, colors, and formatting of text, hyperlinks , and other parts of a page.

Use Styles Instead of FrontPage Themes

FrontPage includes a feature that enables you to choose an entire Web's appearance at one time ” themes . You can modify parts of a theme, like a text font, and all selected Web pages will be updated to reflect the change.

Themes are similar to Cascading Style Sheets, but are much more limited. Everything you use a theme for can be handled manually within Page view. You can set the background, establish all fonts, and create your own navigation bar graphics.

One of the things you can do with CSS is apply a theme. If you choose not to apply a theme using CSS, FrontPage will apply the graphics, fonts, and colors of a theme using standard HTML. CSS can produce the same effects.

CSS can't be used to apply a theme if you're targeting a browser audience with anything below Internet Explorer 3.0 or Navigator 4.0. Style sheets are not supported by WebTV or older browsers.

Unlike themes, Cascading Style Sheets can be used for techniques that are completely impossible in HTML. Take a look at Figure 42.1.

Figure 42.1. A Web page that uses Cascading Style Sheets.

This Web page uses CSS to do several unusual things:

• Remove the blank line between paragraphs of text

• Indent the start of each paragraph

• Justify paragraphs along the right margin

• Give one paragraph its own border edge and background color

Style sheets enable you to take control of formatting decisions that have been automatically handled by the browser until now, such as the blank line between paragraphs that has been standard to most browsers for years . They also give you many more options for determining the appearance of the different page elements.