Linking a Web Page to a CSS Style Sheet

  • Article

When CSS styles reside on an external CSS style sheet, any style changes made there are automatically reflected in all Web documents linked to it. You can link many documents to the same CSS external style sheet. This eliminates the redundant task of recreating CSS styles in multiple documents and ensures that styles will remain consistent on all your Web pages.

To add a LINK to a CSS style sheet in Design view

  1. Open the HTML document to which you want to link a style sheet for editing in Design view.

  2. On the Format menu, choose Document Styles.

    Note   The Document Styles option becomes available on the Format menu when you open an HTML document in Design view, and set its targetSchema property to a Web browser that supports HTML 4.0 or later.

  3. On the Format menu, choose Document Styles.

To add a LINK to a CSS style sheet in HTML view

  1. Open an HTML document in HTML view.

  2. Drag the desired style sheet from Solution Explorer to the <HEAD> section of the active HTML document. A new LINK element is inserted:

    <LINK REL="stylesheet" TYPE="text/css" HREF="MyStyles.css">

    MyStyles.css is the name of your external CSS style sheet.

  3. As needed, edit the path to the style sheet file specified in the HREF attribute.

To add a LINK to a CSS style sheet from the Document Styles window

  1. Open an HTML document in Design view.

  2. On the Format menu, choose Document Styles.

    The Document Styles window appears.

  3. At the top of the Document Styles window, choose Add Style Link.

    The Select Style Sheet dialog box appears.

  4. Go to a CSS style sheet document, and choose Open.

    The path to the link appears in the Document Styles window.

  5. As needed (for example, to specify a relative path to the style sheet), switch to HTML view, and edit the path to the style sheet file in the new LINK element.

See Also

Working With CSS Styles | Introduction to Cascading Style Sheets | Building CSS Styles | Creating an External CSS Style Sheet | Applying a CSS Style to Another Web Page