Microsoft FrontPage 2003

Converting Embedded to External Style Sheets

Creating and refining an embedded style sheet can be easier than creating an external style sheet because you can actually see the results applied to the document rather than just the dialog box sample. You can also see the results of an individual style as compared to other styles you have created. Once the style sheet nears completion, you can convert the embedded style sheet to an external style sheet. External style sheets can be attached to any number of web pages at the same time.

Capturing the Embedded Style Sheet
Creating the External Style Sheet
Referencing the External Style Sheet

Capturing the Embedded Style Sheet

To capture the embedded style sheet, use the Cut option. This removes the style sheet from the current document and allows you to use the Paste option to insert it into an external style sheet.

Open the document containing the embedded style sheet
Click SHOW CODE VIEW
Select the style sheet code
NOTES:
The style sheet is located near the beginning of the code.
It begins with <STYLE> and ends with </STYLE>.
Be sure to select all of the related text.
From the Edit menu, select Cut
Complete the steps for Creating the External Style Sheet
Close the web page
WARNING: If you save changes before closing the file, your style sheet may be lost if it is somehow removed from the Clipboard before pasted into the external style sheet.

Creating the External Style Sheet

From the File menu, select New...
The New task pane appears.
Under New page, click MORE PAGE TEMPLATES...
The Page Templates dialog box appears.
Select the Style Sheets tab
For a blank canvas, select Normal Style Sheet
Click OK
The new external style sheet opens.
From the Edit menu, select Paste
Delete the beginning and ending codes of <STYLE>, </STYLE>,
From the File menu, select Save As...
The Save As dialog box appears.
Using the Save in pull-down list and other navigational tools, select the desired save location
From the Save as type pull-down list, select CSS Files (*.css)
In the File name text box, type a name for the style sheet
NOTE: The filename must have a .css extension
Click SAVE
The external style sheet is created and saved.

Referencing the External Style Sheet

The last step in converting embedded style sheets to external style sheets is to reference the external style sheet in the desired web page(s). For information on how to do this, refer to Referencing an External Style Sheet.