7.4. Applying Styles
The whole point of styles is to enhance your pages. Now that you've created a few styles, the last step is actually applying them to page elements. How you do so depends upon what kinds of styles you created.
Inline and embedded styles with tag selectors show up immediately without any further action on your part. FrontPage automatically applies the proper formatting to the specified tags. Steps for getting your external and user -defined styles onto your pages follow.
7.4.1. Linking to an External Style Sheet
If you want your pages to adopt external styles (Section 7.1.1), you've got to link your HTML pages to the style sheet that you've created. The fastest way to do this is to open a Web page in Design view, locate the .css file in your folder list, and drag it into the document window.
However, you probably want to link multiple Web pages to a particular sheet. To do so, first pop over to Folder view (Section 3.3). Select the page(s) that you want to follow the external style rules, and then select Format Style Sheet Links. A Link Style Sheet dialog box opens (Figure 7-6).
Then click Add and browse to the style sheet file. Select it and click OK. You can add as many style sheets to your site as you want.
If a Web page you've linked to the style sheet is currently open in Design view, you'll immediately see it take on the new styles.
Note: If you're linking multiple pages, some may already have links to style sheets. If they're all linked to the same style sheet(s), no problem. But if separate pages have different style sheet links, FrontPage can't handle the confusion. The program displays a confirmation prompt, asking if you want to overwrite existing links. The prompt gives you an option to cancel, continue, or examine a links report to see what links are in place. If you choose to continue, FrontPage overwrites links for all pages with the new style sheets you choose.
If you don't like the effect, or chose the wrong style sheet, unlink it. Return to the Link Style Sheet dialog box, select the style sheet, and then click Remove.
7.4.2. Applying a Class Style
FrontPage automatically applies any styles you associate with a tag, but when you create a user-defined style (Section 7.1.2), you must manually apply it to elements on your Web page. To do this, it helps to have the Style toolbar active (View Toolbars Style).
You can apply styles in various ways. It all depends upon the target element.
To apply style to textfor example, say you want to apply a rule to every snippet of text that describes one of your productsselect the characters or paragraph that compose a description, and then do one of the following:
Note: You can apply the style to only one selection at a time. In other words, if other types of text separate each product description, you won't be able to select all your product descriptions at once and apply the style. You'd have to select one chunk of text, apply the style, and repeat.
If the element is a picture, table, or layer, applying a style can be trickier. Try the method above, but if it doesn't work, you've got a couple other options:
Note: An ID is a unique label for an item that lives inside its HTML tag. FrontPage often creates IDs automatically. If the item has no ID, you can assign one. For details on creating an ID, see the box "ID Your Elements" on Section 9.4.5 in Chapter 9.
7.4.3. Removing a Class Style
Perhaps you've grown bored with the pink boldface you've applied to the text throughout your site? The steps you need to take for removing a class style depend upon the element affected by the rule.
To remove a class style from text, select the text and select Format Remove Formatting.
Note: You must select all the text in order for this to work, even for a paragraph style. You can't just click inside a paragraph to remove a style (though that's all you need to do to apply one). You must select all the text the paragraph comprises.
To remove a class style from an image or table, right-click the object and then select the Properties option for the item, such as Picture Properties. Click the Style button in the Properties dialog box and delete the style from the Class drop-down list. Click OK to close and save settings in both dialog boxes. If that doesn't work, select the item, and then select Normal from the Style drop-down list.