JavaScript EditorBest javascript editor debugger     Ajax website 

Main Page

Previous Page
Next Page

Creating an Internal Style Sheet

Internal style sheets let you set the styles at the top of the (X)HTML document to which they should be applied. If you plan to apply the style sheet to more than one page, you're better off using external style sheets (see page 128).

To create an internal style sheet:

In the head section of your (X)HTML document, type <style type="text/css">.

Define as many style rules as desired (see page 120).

Type </style> to complete the internal style sheet (Figure 8.12).

Figure 8.12. The style element and its enclosed style rules go in the head section of your document. Don't forget the closing </style> tag, as for some reason I am wont to do.

Figure 8.13. The result is exactly the same as if you linked to the styles in an external style sheet. The difference is that no other Web page can take advantage of the styles used on this page.


  • Styles applied in an internal style sheet override external style sheets if and only if the style tag comes after the link tag. For more details, see The Importance of Location on page 135.

  • Add (X)HTML comment tags (<!--) after the initial <style> tag and before (-->) the final </style> tag to hide styles from very old browsers (see page 67). In XHTML, you can enclose an internal style sheet in <![CDATA[ ... ]]> to hide it from XML parsers (see page 319).

  • You can also apply styles to individual (X)HTML tags. For more details, consult Applying Styles Locally on page 134.

  • If you want to apply your styles to more than one Web page, you should use an external style sheet. For more information, consult Creating an External Style Sheet on page 128.

  • If you use a different style sheet language (like XSL), you'll have to adjust the type attribute accordingly, e.g., text/xsl.

Previous Page
Next Page

JavaScript EditorBest javascript editor debugger     Ajax website