Working with Cascading Style Sheets

3 4

Cascading style sheets (CSS) are used to format Web pages in much the same way traditional style sheets are used to format standard Word documents. The role of a cascading style sheet is to present a Web page's formatting information in a specific place—either at the beginning of an HTML document or in a separate document—in a format that browsers can easily interpret and apply to the associated Web page or Web pages. Using cascading style sheets provides a convenient way to format several Web pages or a whole Web site. When cascading style sheets are in use, you can change the format of Web pages by making changes to the style sheet information instead of editing individual Web pages.

Because Word automatically creates your source code, you don't actually see when Word creates cascading style sheets. By default, Word uses cascading style sheets if your target browser option is set to Internet Explorer 4 or Netscape Navigator 4. (For more information about configuring your target browser, see the section "Specifying Target Browser Options".) When Word creates a cascading style sheet, Word embeds the style sheet at the top of each Web page.

In addition to generating cascading style sheet information, you can use Word to attach, remove, and manage cascading style sheets for Web pages. You can also use Word to attach more than one style sheet to a Web page if necessary. For example, you might have one style sheet that's part of a large Web site, such as a style sheet for an international corporation, and another style sheet that defines a smaller group of related pages, such as a style sheet for a regional office. You can then specify which style sheet takes precedence over the other, in case conflicting styles are defined for the same elements. When you attach a style sheet to your Web page in Word, the styles contained in the cascading style sheet will appear in the Styles And Formatting task pane.

For more information about the Styles And Formatting task pane, see Chapter 10, "Using Styles to Increase Your Formatting Power."

Attaching Cascading Style Sheets

If you have a cascading style sheet file, you can attach it to a Web page. Cascading style sheets carry the .css extension. You attach a cascading style sheet to a document in the same way you attach a global template or an add-in. Specifically, you must complete the following steps:

1. Choose Tools, Templates And Add-Ins. The Templates And Add-Ins dialog box appears.
2. Click the Linked CSS button. The Linked CSS Style Sheets dialog box opens, as shown in Figure 31-23.

   

   Figure 31-23. You can use the Linked CSS Style Sheets dialog box to attach, detach, and prioritize cascading style sheets.

3. Click the Add button. The Add CSS Link dialog box (which looks very similar to the Open dialog box) opens and displays any cascading style sheet files stored in your Templates folder.
4. Select the cascading style sheet you want to add, and then click OK.
5. To attach multiple style sheets to a document, repeat steps 3 and 4. After you've finished attaching cascading style sheets, click OK. A message box will appear, stating that the style sheet has changed and that you must save and reload the document. To have Word do this for you, click Yes.
6. Click OK to close the Templates And Add-Ins dialog box.

After you attach a cascading style sheet to a document, the styles from the cascading style sheet will appear in the Styles And Formatting task pane.

---

Changing the Order of Cascading Style Sheets

The order of cascading style sheets provides a precedence that determines which styles are applied if two or more style sheets have conflicting settings for the same element. When you move a style sheet up in the list, you assign a higher priority to the style sheet. Likewise, when you move a style sheet down in the list, you assign a lower priority to the style sheet. To configure precedence among style sheets, follow these steps:

1. Choose Tools, Templates And Add-Ins. The Templates And Add-Ins dialog box appears.
2. Click the Linked CSS button. The Linked CSS Style Sheets dialog box appears.
3. Select a style sheet in the list, and then click Move Up or Move Down to change the style sheet's precedence.
4. Click OK to close the Linked CSS Style Sheets dialog box, and click OK to close the Templates And Add-Ins dialog box.

---

Detaching Cascading Style Sheets

You can detach a cascading style sheet if you want to stop using the cascading style sheet to format a document. To do so, follow these steps:

1. Choose Tools, Templates And Add-Ins. The Templates And Add-Ins dialog box appears.
2. Clicked the Linked CSS button. The Linked CSS Style Sheets dialog box appears.
3. Select the style sheet you want to remove, and then click Remove.
4. Remove any other style sheets you want to detach, and then click OK when you've finished. A message box will appear, stating that the style sheet has changed and that you must save and reload the document. To have Word do this for you, click Yes.
5. Click OK to close the Templates And Add-Ins dialog box.

Keep in mind that when you remove a style sheet from the list, you don't delete the style sheet's file; you simply instruct the current document to stop referring to the style sheet.