FrontPage External Style Sheets

1. On the File menu, point to New, and then click Page or Web.
2. On the New Page or Web task pane, under New from template, click Page Templates.
3. Click the Style Sheets tab and click Normal style sheet to create a blank style sheet and then click OK.
4. FrontPage creates a new page with a .css file name extension and opens it for editing in Page view.
5. Note 1: The Style toolbar appears when you create a CSS. You can click on the toolbar to activate the Style dialog box.
6. Note 2: You need to save the file (with an appropriate name) Before you can link the style sheet file to a Web page.

For FrontPage 2003

1. On the File menu, click New.
2. In the New task pane  under New page, click More page templates.
3. On the Style Sheets tab, click Normal style sheet to create a blank style sheet and then click OK.
4.  FrontPage 2003 creates a new page with a .css file name extension and opens it for editing.
5. Note 1: The Style toolbar appears when you create a CSS. You can click on the toolbar to activate the Style dialog box.
6. Note 2: You need to save the file (with an appropriate name) Before you can link the style sheet file to a Web page.
    

You can then modify styles using the same method as for embedded style sheets. As an example I will create an external style sheet that has a modified H1 tag. After following the procedure above you should have a page called new_page_1.css open as shown below:

To create a new style or modify an existing one click the style button and select the tag you wish to modify. Here I will modify the H1 tag just as before in the embedded example. When finished click ok. The result is shown below

Now all you need to do is to make any other style changes and save the file in the root of the website with an appropriate name e.g. makingwebsite.css.

To use the external style sheet open a web page. Here index.htm. Select format>style sheet links and the style sheet dialogue box appears.

 Select the style sheet here makingwebsite.css and click ok. The external style sheet is now linked to the page and the style takes effect. The resulting HTML showing how the style sheet is referenced is shown below:

Although FrontPage can be used for both creating and editing both embedded and external style sheets it is a very primitive css editor. For creating style sheets with more functionality you need to use a more powerful css editor. See Using TopStyle Lite.

Web www.build-your-website.co.uk

Related Resources and Articles:

• Cascading Style Sheets
• Starting With Microsoft FrontPage
• FrontPage Embedded Style Sheets